refactor(testcafe): add eslint and chrome download for headless

.eslintrc.json

@@ -2,5 +2,8 @@
   "extends": ["cozy-app/react"],
   "rules": {
     "no-console": 1
+  },
+  "globals": {
+    "fixture": false
   }
 }

package.json

@@ -110,7 +110,7 @@
     "fastclick": "1.0.6",
     "filesize": "3.6.1",
     "hammerjs": "2.0.8",
-    "homedir": "^0.6.0",
+    "homedir": "0.6.0",
     "intersection-observer": "0.5.0",
     "justified-layout": "2.1.1",
     "kd-tree-javascript": "1.0.3",

src/drive/web/modules/upload/UploadButton.jsx

@@ -28,7 +28,7 @@ const UploadButton = ({ label, disabled, onUpload, className }) => (
       <Icon icon="upload" />
       <span>{label}</span>
       <input
-        data-test-id="uploadButton"
+        data-test-id="upload-btn"
         type="file"
         multiple
         style={styles.input}

testcafe/runner-drive.js

@@ -5,7 +5,7 @@ async function runRunner() {
   const runner = await tc.createRunner()
   const response = await runner
     .src(['testcafe/tests/drive_nav.js', 'testcafe/tests/drive_sharing.js'])
-    .browsers(['chrome --start-maximized'])
+    .browsers(['chrome:headless:emulation:cdpPort=9222 --start-maximized']) //emulation:cdpPort=9222 is used to set the download folder in headless mode
 
     .screenshots(
       'reports/screenshots/',

testcafe/tests/drive_nav.js

@@ -1,4 +1,3 @@
-import { Selector, Role } from 'testcafe'
 import { driveUser } from './helpers/roles'
 import { TESTCAFE_DRIVE_URL, isExistingAndVisibile } from './helpers/utils'
 
@@ -10,7 +9,7 @@ fixture`DRIVE - NAV`.page`${TESTCAFE_DRIVE_URL}/`.beforeEach(async t => {
   await t.useRole(driveUser)
 })
 
-test('Drive Navigation Desktop Resolution: Drive, Recent, Sharing, Trash', async t => {
+test('Drive Navigation Desktop Resolution: Drive, Recent, Sharing, Trash', async () => {
   //Check Menu and links. Go to page. Check main menu on each page
   await isExistingAndVisibile(page.sidebar, 'Sidebar')
 

testcafe/tests/drive_sharing.js

@@ -1,10 +1,13 @@
-import { Selector, Role } from 'testcafe'
+import { Role } from 'testcafe'
 import { driveUser } from './helpers/roles'
 import {
-  TESTCAFE_DRIVE_URL,
-  getCurrentDateTime,
-  FOLDER_DATE_TIME
+  deleteLocalFile,
+  checkLocalFile,
+  setDownloadPath
 } from './helpers/utils'
+import { TESTCAFE_DRIVE_URL, FOLDER_DATE_TIME } from './helpers/utils'
+import homedir from 'homedir'
+
 import Data from './helpers/data'
 const data = new Data()
 
@@ -16,6 +19,8 @@ const publicDrivePage = new PublicDrivePage()
 
 const file = '[cozy]QA_table_ APPS.pdf'
 
+/*eslint-disable-next-line no-unused-vars*/
+
 //************************
 //Tests when authentified
 //************************
@@ -26,7 +31,7 @@ fixture`Folder link Sharing Scenario`.page`${TESTCAFE_DRIVE_URL}/`.beforeEach(
   }
 )
 
-test('Drive : Create a $test_date_time folder in Drive', async t => {
+test('Drive : Create a $test_date_time folder in Drive', async () => {
   await drivePage.addNewFolder(FOLDER_DATE_TIME)
   //We need to pass FOLDER_DATE_TIME through multiple fixture, so we cannot use ctx here.
 })
@@ -52,10 +57,12 @@ test('Drive : from Drive, go in a folder, upload a file, and share it', async t
 fixture`Drive : Access a folder public link`.page`${TESTCAFE_DRIVE_URL}/`
   .beforeEach(async t => {
     await t.useRole(Role.anonymous())
+    await setDownloadPath(`${homedir()}/Downloads`)
   })
-  .afterEach(async t => {
-    await publicDrivePage.checkLocalFile('files.zip')
-    await publicDrivePage.deleteLocalFile('files.zip')
+  .afterEach(async () => {
+    const filepath = `${homedir()}/Downloads/files.zip`
+    await checkLocalFile(filepath)
+    await deleteLocalFile(filepath)
   })
 test('Drive : Access a folder public link (desktop)', async t => {
   await t.navigateTo(data.sharingLink)
@@ -95,7 +102,7 @@ fixture`Drive : Unshare public link`.page`${TESTCAFE_DRIVE_URL}/`.beforeEach(
     await drivePage.waitForLoading()
   }
 )
-test('Unshare foler', async t => {
+test('Unshare foler', async () => {
   await drivePage.goToFolder(FOLDER_DATE_TIME)
   await drivePage.unshareFolderPublicLink()
 })
@@ -122,7 +129,7 @@ fixture`Test clean up : remove files and folders`
   await t.useRole(driveUser)
   await drivePage.waitForLoading()
 })
-test('Delete File, and foler', async t => {
+test('Delete File, and foler', async () => {
   await drivePage.goToFolder(FOLDER_DATE_TIME)
   await drivePage.deleteElementByName(file)
   await drivePage.deleteCurrentFolder()

testcafe/tests/helpers/utils.js

@@ -1,6 +1,9 @@
 import { ClientFunction, Selector, t } from 'testcafe'
-
+import fs from 'fs'
+const path = require('path')
+const CDP = require('chrome-remote-interface')
 const INSTANCE_TESTCAFE = process.env.INSTANCE_TESTCAFE
+
 export let TESTCAFE_PHOTOS_URL = ''
 export let TESTCAFE_DRIVE_URL = ''
 
@@ -39,7 +42,7 @@ export async function isExistingAndVisibile(selector, selectorName) {
   console.log(`'${selectorName}' exists and is visible!`)
 }
 
-export function getCurrentDateTime() {
+function getCurrentDateTime() {
   let prettyCurrentDate = new Date()
     .toISOString()
     .substr(0, 19)
@@ -57,3 +60,31 @@ export const overwriteCopyCommand = ClientFunction(() => {
 export const getLastExecutedCommand = ClientFunction(
   () => window.lastExecutedCommand
 )
+
+//@param{string} filepath : Expected full path to file
+export async function checkLocalFile(filepath) {
+  await t.expect(fs.existsSync(filepath)).ok(`${filepath} doesn't exist`)
+  console.log(`${filepath} exists on local drive`)
+}
+//@param{string} filepath : Expected full path to file
+export async function deleteLocalFile(filepath) {
+  fs.unlink(filepath, function(err) {
+    if (err) throw err
+    // if no error, file has been deleted successfully
+    console.log(`${filepath} deleted`)
+  })
+}
+
+//Chrome:headless does not download file in the download Folder by default
+//This function set the path for the download folder
+export async function setDownloadPath(downloadFolderPath) {
+  const client = await CDP()
+  const { Network, Page } = client
+
+  await Promise.all([Network.enable(), Page.enable()])
+
+  await Page.setDownloadBehavior({
+    behavior: 'allow',
+    downloadPath: path.resolve(__dirname, downloadFolderPath)
+  })
+}

testcafe/tests/pages/drive-model-public.js

@@ -3,13 +3,9 @@ import {
   getElementWithTestId,
   isExistingAndVisibile,
   getPageUrl,
-  goBack,
-  getResponseStatusCode
+  goBack
 } from '../helpers/utils'
 
-import fs from 'fs'
-import homedir from 'homedir'
-
 export default class PublicDrivePage {
   constructor() {
     //loading
@@ -107,23 +103,6 @@ export default class PublicDrivePage {
     await this.waitForLoading()
   }
 
-  //@param{string} filename : Expected filename
-  async checkLocalFile(filename) {
-    const filepath = `${homedir()}/Downloads/${filename}`
-    await t
-      .expect(fs.existsSync(filepath))
-      .ok(`Downloaded ${filename} doesn't exist`)
-    console.log(`${filename} is downloaded`)
-  }
-
-  async deleteLocalFile(filename) {
-    const filePath = `${homedir()}/Downloads/${filename}`
-    fs.unlink(filePath, function(err) {
-      if (err) throw err
-      // if no error, file has been deleted successfully
-      console.log(`${filename} deleted`)
-    })
-  }
   async checkNotAvailable() {
     await isExistingAndVisibile(this.errorAvailable)
   }

testcafe/tests/pages/drive-model.js

@@ -1,9 +1,8 @@
-import { Selector, t, ClientFunction } from 'testcafe'
+import { Selector, t } from 'testcafe'
 import {
   getElementWithTestId,
   getPageUrl,
   isExistingAndVisibile,
-  getClipboardData,
   overwriteCopyCommand,
   getLastExecutedCommand
 } from '../helpers/utils'
@@ -66,7 +65,7 @@ export default class DrivePage {
     }
 
     // Upload
-    this.btnUpload = getElementWithTestId('uploadButton')
+    this.btnUpload = getElementWithTestId('upload-btn')
     this.divUpload = getElementWithTestId('upload-queue')
     this.divUploadSuccess = getElementWithTestId('upload-queue-success')
 
@@ -91,6 +90,7 @@ export default class DrivePage {
     this.modalDeleteBtnDelete = this.modalDelete.find('button').nth(2) //REMOVE
   }
 
+  //wait for content placeholder to disapered
   async waitForLoading() {
     await t
       .expect(this.contentPlaceHolder.exists)

testcafe/tests/pages/photos-model.js

@@ -10,7 +10,7 @@ export default class Page {
     this.photoEmpty = Selector('[class*="c-empty"]')
 
     // Upload
-    this.btnUpload = getElementWithTestId('uploadButton')
+    this.btnUpload = getElementWithTestId('upload-btn')
     this.divUpload = getElementWithTestId('upload-queue')
     this.divUploadSuccess = getElementWithTestId('upload-queue-success')
     this.modalUpload = Selector('[class*="c-alert-wrapper"]', {