[js-code-coverage] Update QuickView tests to optionally use $i18n{} text

CL:2559234 introduced changes to disable $i18n{} JS template replacement
when the --devtools-code-coverage command line flag is enabled, and only
for the ChromeOS Files app extension while in-test.

Update the files app QuickView integration tests to work with or without
the --devtools-code-coverage flag. Add helper i18nQuickViewLabelText for
extracting the expected QuickView item text (JS code coverage flag on or
flag off).

Minor: update getQuickViewMetadataBoxField with hidden option to support
callers wanting to check that a metadata box field is hidden. Also, some
changes for uniformity in "Check: the thing should happen" comments.

	--devtools-code-coverage

Test: browser_tests --gtest_filter="QuickView/FilesApp*"
Test: browser_tests --gtest_filter="QuickView/FilesApp*"
Bug: 1152612
Change-Id: Ie59f11d85038d91e4519551b144ea1f51f555533
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2560017Reviewed-by: Alex Danilo <adanilo@chromium.org>
Commit-Queue: Noel Gordon <noel@chromium.org>
Cr-Commit-Position: refs/heads/master@{#831196}

ui/file_manager/integration_tests/file_manager/quick_view.js

@@ -21,6 +21,70 @@
     SELECTION_MENU: 2,
   };
 
+  /**
+   * Returns the $i18n{} label for the Quick View item |text| if devtools code
+   * coverage is enabled. Otherwise, returns |text|.
+   *
+   * @param {string} text Quick View item text.
+   * @return {!Promise<string>}
+   */
+  async function i18nQuickViewLabelText(text) {
+    const isDevtoolsCoverageActive =
+        await sendTestMessage({name: 'isDevtoolsCoverageActive'});
+
+    if (isDevtoolsCoverageActive !== 'true') {
+      return text;
+    }
+
+    /** @const {!Object<string, string>} */
+    const i18nQuickViewItemTextLabels = {
+      // Quick View toolbar button items.
+      'Back': 'QUICK_VIEW_CLOSE_BUTTON_LABEL',
+      'Delete': 'QUICK_VIEW_DELETE_BUTTON_LABEL',
+      'File info': 'QUICK_VIEW_TOGGLE_METADATA_BOX_BUTTON_LABEL',
+      'Open': 'QUICK_VIEW_OPEN_IN_NEW_BUTTON_LABEL',
+
+      // Quick View content panel items.
+      'No preview available': 'QUICK_VIEW_NO_PREVIEW_AVAILABLE',
+
+      // Quick View metadata box items.
+      'Album': 'METADATA_BOX_ALBUM_TITLE',
+      'Artist': 'METADATA_BOX_MEDIA_ARTIST',
+      'Audio info': 'METADATA_BOX_AUDIO_INFO',
+      'Codec': 'METADATA_BOX_CODEC',
+      'Created by': 'METADATA_BOX_CREATED_BY',
+      'Created time': 'METADATA_BOX_CREATION_TIME',
+      'Date modified': 'METADATA_BOX_MODIFICATION_TIME',
+      'Device model': 'METADATA_BOX_EXIF_DEVICE_MODEL',
+      'Device settings': 'METADATA_BOX_EXIF_DEVICE_SETTINGS',
+      'Dimensions': 'METADATA_BOX_DIMENSION',
+      'Duration': 'METADATA_BOX_DURATION',
+      'File location': 'METADATA_BOX_FILE_LOCATION',
+      'Frame rate': 'METADATA_BOX_FRAME_RATE',
+      'General info': 'METADATA_BOX_GENERAL_INFO',
+      'Genre': 'METADATA_BOX_GENRE',
+      'Geography': 'METADATA_BOX_EXIF_GEOGRAPHY',
+      'Image info': 'METADATA_BOX_IMAGE_INFO',
+      'Modified by': 'METADATA_BOX_MODIFIED_BY',
+      'Page count': 'METADATA_BOX_PAGE_COUNT',
+      'Path': 'METADATA_BOX_FILE_PATH',
+      'Size': 'METADATA_BOX_FILE_SIZE',
+      'Source': 'METADATA_BOX_SOURCE',
+      'Title': 'METADATA_BOX_MEDIA_TITLE',
+      'Track': 'METADATA_BOX_TRACK',
+      'Type': 'METADATA_BOX_MEDIA_MIME_TYPE',
+      'Video info': 'METADATA_BOX_VIDEO_INFO',
+      'Year recorded': 'METADATA_BOX_YEAR_RECORDED',
+    };
+
+    // Verify |text| has an $i18n{} label in |i18nQuickViewItemTextLabels|.
+    const label = i18nQuickViewItemTextLabels[text];
+    chrome.test.assertEq('string', typeof label, 'Missing: ' + text);
+
+    // Return the $i18n{} label of |text|.
+    return '$i18n{' + label + '}';
+  }
+
   /**
    * Waits for Quick View dialog to be open.
    *
@@ -164,14 +228,16 @@
 
   /**
    * Assuming that Quick View is currently open per openQuickView above, return
-   * the text shown in the QuickView Metadata Box field |name|.
+   * the text shown in the QuickView Metadata Box field |name|. If the optional
+   * |hidden| is 'hidden', the field |name| should not be visible.
    *
    * @param {string} appId Files app windowId.
    * @param {string} name QuickView Metadata Box field name.
+   * @param {string} hidden Whether the field name should be visible.
    *
    * @return {!Promise<string>} text Text value in the field name.
    */
-  async function getQuickViewMetadataBoxField(appId, name) {
+  async function getQuickViewMetadataBoxField(appId, name, hidden = '') {
     let filesMetadataBox = 'files-metadata-box';
 
     /**
@@ -204,12 +270,18 @@
      * The <files-metadata-entry key="name"> element resides in the shadow DOM
      * of the <files-metadata-box>.
      */
-    quickViewQuery.push(`files-metadata-entry[key="${name}"]`);
+    const nameText = await i18nQuickViewLabelText(name);
+    quickViewQuery.push('files-metadata-entry[key="' + nameText + '"]');
 
     /**
-     * It has a #value div child in its shadow DOM containing the field value.
+     * It has a #value div child in its shadow DOM containing the field value,
+     * but if |hidden| was given, the field should not be visible.
      */
-    quickViewQuery.push('#value > div:not([hidden])');
+    if (hidden !== 'hidden') {
+      quickViewQuery.push('#value > div:not([hidden])');
+    } else {
+      quickViewQuery.push('#box[hidden]');
+    }
 
     const element = await remoteCall.waitForElement(appId, quickViewQuery);
     return element.text;
@@ -563,7 +635,7 @@
       }
     });
 
-    // Check metadata is loaded correctly.
+    // Check: the correct size and date modified values should be displayed.
     const sizeText = await getQuickViewMetadataBoxField(appId, 'Size');
     chrome.test.assertEq(ENTRIES.hello.sizeText, sizeText);
     const lastModifiedText =
@@ -648,13 +720,8 @@
           'deepQueryAllElements', appId, [webView, ['display']]));
     });
 
-    // Check: no mimeType information is displayed. Note that there are multiple
-    // levels of shadow DOM present in this query.
-    const mimeTypeQuery = [
-      '#quick-view', '#dialog[open] files-metadata-box[metadata~="mime"]',
-      'files-metadata-entry[key="Type"]', '#box[hidden]'
-    ];
-    await remoteCall.waitForElement(appId, mimeTypeQuery);
+    // Check: the mimeType field should not be displayed.
+    await getQuickViewMetadataBoxField(appId, 'Type', 'hidden');
   };
 
   /**
@@ -704,7 +771,7 @@
       }
     });
 
-    // Check: the correct file size should be shown.
+    // Check: the correct file size should be displayed.
     const size = await getQuickViewMetadataBoxField(appId, 'Size');
     chrome.test.assertEq('191 bytes', size);
   };
@@ -855,6 +922,10 @@
     // Open the file in Quick View.
     await openQuickView(appId, ENTRIES.tallPdf.nameText);
 
+    // Get the content panel 'No preview available' item text.
+    const noPreviewAvailableText =
+        await i18nQuickViewLabelText('No preview available');
+
     // Wait for the innerContentPanel to load and display its content.
     function checkInnerContentPanel(elements) {
       const haveElements = Array.isArray(elements) && elements.length === 1;
@@ -862,7 +933,7 @@
         return pending(caller, 'Waiting for inner content panel to load.');
       }
       // Check: the PDF preview should not be shown.
-      chrome.test.assertEq('No preview available', elements[0].text);
+      chrome.test.assertEq(noPreviewAvailableText, elements[0].text);
       return;
     }
     await repeatUntil(async () => {
@@ -914,7 +985,7 @@
     const mimeType = await getQuickViewMetadataBoxField(appId, 'Type');
     chrome.test.assertEq('text/plain', mimeType);
 
-    // Check: the correct file location should be displayed in Downloads.
+    // Check: the correct file location should be displayed.
     const location = await getQuickViewMetadataBoxField(appId, 'File location');
     chrome.test.assertEq('My files/Downloads/page.mhtml', location);
   };
@@ -984,13 +1055,8 @@
           'deepExecuteScriptInWebView', appId, [webView, getScrollY]));
     });
 
-    // Check: no mimeType information is displayed. Note that there are multiple
-    // levels of shadow DOM present in this query.
-    const mimeTypeQuery = [
-      '#quick-view', '#dialog[open] files-metadata-box[metadata~="mime"]',
-      'files-metadata-entry[key="Type"]', '#box[hidden]'
-    ];
-    await remoteCall.waitForElement(appId, mimeTypeQuery);
+    // Check: the mimeType field should not be displayed.
+    await getQuickViewMetadataBoxField(appId, 'Type', 'hidden');
   };
 
   /**
@@ -1434,7 +1500,7 @@
           'deepQueryAllElements', appId, [webView, ['display']]));
     });
 
-    // Check: the Dimensions shown in the metadata box are correct.
+    // Check: the correct image dimensions should be displayed.
     const size = await getQuickViewMetadataBoxField(appId, 'Dimensions');
     chrome.test.assertEq('1324 x 4028', size);
 
@@ -1481,7 +1547,7 @@
           'deepQueryAllElements', appId, [webView, ['display']]));
     });
 
-    // Check: the correct file mimeType should be displayed.
+    // Check: the correct mimeType should be displayed.
     let mimeType = await getQuickViewMetadataBoxField(appId, 'Type');
     chrome.test.assertEq('image/png', mimeType);
 
@@ -1499,7 +1565,7 @@
           'deepQueryAllElements', appId, [webView, ['display']]));
     });
 
-    // Check: the next should be displayed in the Quick View.
+    // Check: the correct mimeType should be displayed.
     mimeType = await getQuickViewMetadataBoxField(appId, 'Type');
     chrome.test.assertEq('image/jpeg', mimeType);
 
@@ -2380,13 +2446,18 @@
    * shown in Quick View.
    */
   testcase.openQuickViewTabIndexImage = async () => {
+    // Get tab-index focus query item texts.
+    const backText = await i18nQuickViewLabelText('Back');
+    const openText = await i18nQuickViewLabelText('Open');
+    const deleteText = await i18nQuickViewLabelText('Delete');
+    const fileInfoText = await i18nQuickViewLabelText('File info');
+
     // Prepare a list of tab-index focus queries.
     const tabQueries = [
-      {'query': ['#quick-view', '[aria-label="Back"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Open"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Delete"]:focus']},
-      {'query': ['#quick-view', '[aria-label="File info"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Back"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + backText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + openText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + deleteText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + fileInfoText + '"]:focus']},
     ];
 
     // Open Files app on Downloads containing ENTRIES.smallJpeg.
@@ -2417,14 +2488,20 @@
    * shown in Quick View.
    */
   testcase.openQuickViewTabIndexText = async () => {
+    // Get tab-index focus query item texts.
+    const backText = await i18nQuickViewLabelText('Back');
+    const openText = await i18nQuickViewLabelText('Open');
+    const deleteText = await i18nQuickViewLabelText('Delete');
+    const fileInfoText = await i18nQuickViewLabelText('File info');
+
     // Prepare a list of tab-index focus queries.
     const tabQueries = [
-      {'query': ['#quick-view', '[aria-label="Back"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Open"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Delete"]:focus']},
-      {'query': ['#quick-view', '[aria-label="File info"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + backText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + openText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + deleteText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + fileInfoText + '"]:focus']},
       {'query': ['#quick-view']},  // Tab past the content panel.
-      {'query': ['#quick-view', '[aria-label="Back"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + backText + '"]:focus']},
     ];
 
     // Open Files app on Downloads containing ENTRIES.tallText.
@@ -2455,13 +2532,18 @@
    * shown in Quick View.
    */
   testcase.openQuickViewTabIndexHtml = async () => {
+    // Get tab-index focus query item texts.
+    const backText = await i18nQuickViewLabelText('Back');
+    const openText = await i18nQuickViewLabelText('Open');
+    const deleteText = await i18nQuickViewLabelText('Delete');
+    const fileInfoText = await i18nQuickViewLabelText('File info');
+
     // Prepare a list of tab-index focus queries.
     const tabQueries = [
-      {'query': ['#quick-view', '[aria-label="Back"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Open"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Delete"]:focus']},
-      {'query': ['#quick-view', '[aria-label="File info"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Back"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + backText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + openText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + deleteText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + fileInfoText + '"]:focus']},
     ];
 
     // Open Files app on Downloads containing ENTRIES.tallHtml.
@@ -2488,8 +2570,8 @@
   };
 
   /**
-   * Tests the tab-index focus order when sending tab keys when an audio file is
-   * shown in Quick View.
+   * Tests the tab-index focus order when sending tab keys when an audio file
+   * is shown in Quick View.
    */
   testcase.openQuickViewTabIndexAudio = async () => {
     // Open Files app on Downloads containing ENTRIES.beautiful song.
@@ -2499,12 +2581,18 @@
     // Open the file in Quick View.
     await openQuickView(appId, ENTRIES.beautiful.nameText);
 
+    // Get tab-index focus query item texts.
+    const backText = await i18nQuickViewLabelText('Back');
+    const openText = await i18nQuickViewLabelText('Open');
+    const deleteText = await i18nQuickViewLabelText('Delete');
+    const fileInfoText = await i18nQuickViewLabelText('File info');
+
     // Prepare a list of tab-index focus queries.
     const tabQueries = [
-      {'query': ['#quick-view', '[aria-label="Back"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Open"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Delete"]:focus']},
-      {'query': ['#quick-view', '[aria-label="File info"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + backText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + openText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + deleteText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + fileInfoText + '"]:focus']},
     ];
 
     for (const query of tabQueries) {
@@ -2537,7 +2625,7 @@
       // Check: back should eventually get the focus again.
       const activeElement = await remoteCall.callRemoteTestUtil(
           'deepGetActiveElement', appId, []);
-      if (activeElement.attributes['aria-label'] === 'Back') {
+      if (activeElement.attributes['aria-label'] === backText) {
         break;
       }
     }
@@ -2555,12 +2643,18 @@
     // Open the file in Quick View.
     await openQuickView(appId, ENTRIES.webm.nameText);
 
+    // Get tab-index focus query item texts.
+    const backText = await i18nQuickViewLabelText('Back');
+    const openText = await i18nQuickViewLabelText('Open');
+    const deleteText = await i18nQuickViewLabelText('Delete');
+    const fileInfoText = await i18nQuickViewLabelText('File info');
+
     // Prepare a list of tab-index focus queries.
     const tabQueries = [
-      {'query': ['#quick-view', '[aria-label="Back"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Open"]:focus']},
-      {'query': ['#quick-view', '[aria-label="Delete"]:focus']},
-      {'query': ['#quick-view', '[aria-label="File info"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + backText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + openText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + deleteText + '"]:focus']},
+      {'query': ['#quick-view', '[aria-label="' + fileInfoText + '"]:focus']},
     ];
 
     for (const query of tabQueries) {
@@ -2593,7 +2687,7 @@
       // Check: back should eventually get the focus again.
       const activeElement = await remoteCall.callRemoteTestUtil(
           'deepGetActiveElement', appId, []);
-      if (activeElement.attributes['aria-label'] === 'Back') {
+      if (activeElement.attributes['aria-label'] === backText) {
         break;
       }
     }
@@ -2738,7 +2832,7 @@
           'deepQueryAllElements', appId, [videoWebView, ['display']]));
     });
 
-    // Check: The MIME type of |world.ogv| is video/ogg
+    // Check: the mimeType of |world.ogv| should be 'video/ogg'.
     const mimeType = await getQuickViewMetadataBoxField(appId, 'Type');
     chrome.test.assertEq('video/ogg', mimeType);
   };