From 3b2f03d11242eff75fb4caa707d8c7b1f975539e Mon Sep 17 00:00:00 2001 From: Paul Irish Date: Tue, 31 Jul 2018 17:33:48 -0700 Subject: [PATCH 1/3] core(i18n): always use formatted strings for extension popup --- lighthouse-extension/app/src/lighthouse-background.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/lighthouse-extension/app/src/lighthouse-background.js b/lighthouse-extension/app/src/lighthouse-background.js index 740e52b6ea64..e6de6f144b5a 100644 --- a/lighthouse-extension/app/src/lighthouse-background.js +++ b/lighthouse-extension/app/src/lighthouse-background.js @@ -9,6 +9,7 @@ const RawProtocol = require('../../../lighthouse-core/gather/connections/raw'); const Runner = require('../../../lighthouse-core/runner'); const Config = require('../../../lighthouse-core/config/config'); const defaultConfig = require('../../../lighthouse-core/config/default-config.js'); +const i18n = require('../../../lighthouse-core/lib/i18n'); const log = require('lighthouse-logger'); /** @typedef {import('../../../lighthouse-core/gather/connections/connection.js')} Connection */ @@ -65,7 +66,9 @@ function runLighthouseInWorker(port, url, options, categoryIDs) { * @return {Array<{title: string, id: string}>} */ function getDefaultCategories() { - return Config.getCategories(defaultConfig); + const categories = Config.getCategories(defaultConfig); + categories.forEach(cat => cat.title = i18n.getFormatted(cat.title, 'en-US')); + return categories; } /** @param {(status: [string, string, string]) => void} listenCallback */ From 8ca6bb8aaa243609cf70d2b7f59232689b345fb5 Mon Sep 17 00:00:00 2001 From: Paul Irish Date: Tue, 31 Jul 2018 17:46:44 -0700 Subject: [PATCH 2/3] lame test. --- lighthouse-extension/test/popup-test.js | 32 ++++++++++++++++++++++++- 1 file changed, 31 insertions(+), 1 deletion(-) diff --git a/lighthouse-extension/test/popup-test.js b/lighthouse-extension/test/popup-test.js index 7806e6752435..73cc6b50aaae 100644 --- a/lighthouse-extension/test/popup-test.js +++ b/lighthouse-extension/test/popup-test.js @@ -40,7 +40,28 @@ describe('Lighthouse chrome popup', function() { selectedCategories: [], useDevTools: false, }), - getDefaultCategories: () => [], + getDefaultCategories: () => [ + { + id: 'performance', + title: 'Performance', + }, + { + id: 'pwa', + title: 'Progressive Web App', + }, + { + id: 'accessibility', + title: 'Accessibility', + }, + { + id: 'best-practices', + title: 'Best Practices', + }, + { + id: 'seo', + title: 'SEO', + }, + ], }; Object.defineProperty(chrome, 'tabs', { @@ -92,4 +113,13 @@ describe('Lighthouse chrome popup', function() { assert.equal(titleText, 'Lighthouse'); assert.equal(urlText, 'http://example.com'); }); + + + // Kinda lame as the mocked data is already good. + // A real test would verify the switch happens in the background page's getDefaultCategories + it('should not have any ICU message IDs in the DOM', async function() { + const bodyText = await page.evaluate(() => document.body.textContent); + const hasIcuMessageInstanceIds = bodyText.includes(' | ') && bodyText.includes(' # '); + assert.ok(!hasIcuMessageInstanceIds, 'icu message ids found'); + }); }); From c99238003daf8794223adbbb2cf0a7ecd35bd0f9 Mon Sep 17 00:00:00 2001 From: Paul Irish Date: Wed, 1 Aug 2018 13:20:56 -0700 Subject: [PATCH 3/3] add test for category checkbox populatin' --- lighthouse-extension/test/popup-test.js | 56 ++++++++++++------------- 1 file changed, 26 insertions(+), 30 deletions(-) diff --git a/lighthouse-extension/test/popup-test.js b/lighthouse-extension/test/popup-test.js index 73cc6b50aaae..5196ed5ee883 100644 --- a/lighthouse-extension/test/popup-test.js +++ b/lighthouse-extension/test/popup-test.js @@ -13,6 +13,21 @@ const puppeteer = require('../../node_modules/puppeteer/index.js'); const lighthouseExtensionPath = path.resolve(__dirname, '../dist'); +const defaultCategoriesStub = [ + { + id: 'performance', + title: 'Performance', + }, + { + id: 'pwa', + title: 'Progressive Web App', + }, + { + id: 'seo', + title: 'SEO', + }, +]; + describe('Lighthouse chrome popup', function() { // eslint-disable-next-line no-console console.log('\n✨ Be sure to have recently run this: yarn build-extension'); @@ -32,7 +47,7 @@ describe('Lighthouse chrome popup', function() { }); page = await browser.newPage(); - await page.evaluateOnNewDocument(() => { + await page.evaluateOnNewDocument((defaultCategoriesStub) => { const backgroundMock = { isRunning: () => false, listenForStatus: () => {}, @@ -40,28 +55,7 @@ describe('Lighthouse chrome popup', function() { selectedCategories: [], useDevTools: false, }), - getDefaultCategories: () => [ - { - id: 'performance', - title: 'Performance', - }, - { - id: 'pwa', - title: 'Progressive Web App', - }, - { - id: 'accessibility', - title: 'Accessibility', - }, - { - id: 'best-practices', - title: 'Best Practices', - }, - { - id: 'seo', - title: 'SEO', - }, - ], + getDefaultCategories: () => defaultCategoriesStub, }; Object.defineProperty(chrome, 'tabs', { @@ -80,7 +74,7 @@ describe('Lighthouse chrome popup', function() { }, }), }); - }); + }, defaultCategoriesStub); page.on('pageerror', err => { pageErrors.push(err); @@ -115,11 +109,13 @@ describe('Lighthouse chrome popup', function() { }); - // Kinda lame as the mocked data is already good. - // A real test would verify the switch happens in the background page's getDefaultCategories - it('should not have any ICU message IDs in the DOM', async function() { - const bodyText = await page.evaluate(() => document.body.textContent); - const hasIcuMessageInstanceIds = bodyText.includes(' | ') && bodyText.includes(' # '); - assert.ok(!hasIcuMessageInstanceIds, 'icu message ids found'); + it('should populate the category checkboxes correctly', async function() { + const checkboxTitles = await page.$$eval('li label', els => els.map(e => e.textContent)); + const checkboxValues = await page.$$eval('li label input', els => els.map(e => e.value)); + + for (const {title, id} of defaultCategoriesStub) { + assert.ok(checkboxTitles.includes(title)); + assert.ok(checkboxValues.includes(id)); + } }); });