[go: nahoru, domu]
Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

clients(extension): firefox #10332

Merged
merged 8 commits into from
Feb 19, 2020
Merged

clients(extension): firefox #10332

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
6714c38
clients(extension): firefox
connorjclark Feb 12, 2020
954e52e
version
connorjclark Feb 13, 2020
a4bb1f2
bundlesize
connorjclark Feb 13, 2020
405462f
comment
connorjclark Feb 14, 2020
c1bbfce
build time replace
connorjclark Feb 14, 2020
8b93709
Merge remote-tracking branch 'origin/master' into firefox-extension
connorjclark Feb 14, 2020
6a7b673
rm default locale
connorjclark Feb 14, 2020
5e3ad1c
firefox release
connorjclark Feb 18, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 16 additions & 11 deletions build/build-extension.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,15 @@ const cpy = require('cpy');
const browserify = require('browserify');
const path = require('path');

const argv = process.argv.slice(2);
const browserBrand = argv[0];

const sourceName = 'popup.js';
const distName = 'popup-bundle.js';

const sourceDir = __dirname + '/../clients/extension';
const distDir = __dirname + '/../dist/extension';
const sourceDir = `${__dirname}/../clients/extension`;
const distDir = `${__dirname}/../dist/extension-${browserBrand}`;
const packagePath = `${distDir}/../extension-${browserBrand}-package`;

const manifestVersion = require(`${sourceDir}/manifest.json`).version;

Expand All @@ -42,17 +46,22 @@ async function buildEntryPoint() {
/**
* @return {Promise<void>}
*/
function copyAssets() {
return cpy([
async function copyAssets() {
await cpy([
'*.html',
'styles/**/*.css',
'images/**/*',
'manifest.json',
'_locales/**', // currently non-functional
], distDir, {
cwd: sourceDir,
parents: true,
});

await cpy([
`_locales/${browserBrand}/en/**`,
], `${distDir}/_locales/en`, {
cwd: sourceDir,
});
}

/**
Expand All @@ -61,7 +70,6 @@ function copyAssets() {
* @return {Promise<void>}
*/
async function packageExtension() {
const packagePath = `${distDir}/../extension-package`;
await mkdir(packagePath, {recursive: true});

return new Promise((resolve, reject) => {
Expand All @@ -81,15 +89,12 @@ async function packageExtension() {
}

async function run() {
const argv = process.argv.slice(2);
if (argv.includes('package')) {
return packageExtension();
}

await Promise.all([
buildEntryPoint(),
copyAssets(),
]);

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this is simpler to use. just always package.

await packageExtension();
}

run();
8 changes: 8 additions & 0 deletions clients/extension/_locales/chrome/en/messages.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
{
"browserBrand": {
"message": "chrome"
},
"localhostErrorMessage": {
"message": "Use DevTools to audit pages on localhost."
}
}
10 changes: 0 additions & 10 deletions clients/extension/_locales/en/messages.json
View file
Open in desktop

This file was deleted.

10 changes: 0 additions & 10 deletions clients/extension/_locales/en/messages_canary.json
View file
Open in desktop

This file was deleted.

8 changes: 8 additions & 0 deletions clients/extension/_locales/firefox/en/messages.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
{
"browserBrand": {
"message": "firefox"
},
"localhostErrorMessage": {
"message": "Use the Lighthouse Node CLI to audit pages on localhost."
}
}
6 changes: 3 additions & 3 deletions clients/extension/manifest.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
{
"name": "__MSG_appName__",
"version": "100.0.0.0",
"name": "Lighthouse",
"version": "100.0.0.1",
"minimum_chrome_version": "72",
"manifest_version": 2,
"description": "__MSG_appDescription__",
"description": "Lighthouse is an open-source, automated tool for improving the performance, quality, and correctness of your web apps.",
"icons": {
"16": "images/lh_favicon_16x16.png",
"128": "images/lh_logo_128x128.png"
Expand Down
22 changes: 15 additions & 7 deletions clients/extension/popup.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,13 +28,21 @@
<span class="psi-disclaimer"><a href="https://developers.google.com/speed/docs/insights/v5/get-started?utm_source=lh-chrome-ext" title="https://developers.google.com/speed/docs/insights/v5/get-started" target="_blank" rel="noopener nofollow">Uses the PSI API</a></span>
<div class="errormsg"></div>
</div>
<div class="section section--devtools-info">
<h2 class="devtools-header">Chrome DevTools</h2>
<span class="devtools-note">
You can also run Lighthouse via the DevTools Audits panel.
<br><br>
Shortcut to open DevTools: <span class="devtools-shortcut"><!-- filled dynamically --></span>
</span>
<div class="section section--secondary-panel">
<div class="browser-brand browser-brand--chrome">
<h2 class="section--header">Chrome DevTools</h2>
<span class="section--description">
You can also run Lighthouse via the DevTools Audits panel.
<br><br>
Shortcut to open DevTools: <span class="devtools-shortcut"><!-- filled dynamically --></span>
</span>
</div>
<div class="browser-brand browser-brand--firefox">
<h2 class="section--header">Node CLI</h2>
<span class="section--description">
You can also run Lighthouse via the <a href="https://github.com/GoogleChrome/lighthouse#using-the-node-cli">Node CLI</a>.
</span>
</div>
</div>
</main>

Expand Down
6 changes: 5 additions & 1 deletion clients/extension/scripts/popup.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@ const SettingsController = require('./settings-controller.js');
const VIEWER_URL = 'https://googlechrome.github.io/lighthouse/viewer/';
const optionsVisibleClass = 'main--options-visible';

const STRINGS = {
localhostErrorMessage: chrome.i18n.getMessage('localhostErrorMessage'),
exterkamp marked this conversation as resolved.
Show resolved Hide resolved
};

/**
* Guaranteed context.querySelector. Always returns an element or throws if
* nothing matches query.
Expand Down Expand Up @@ -120,7 +124,7 @@ function getSiteUrl() {

const url = new URL(tabs[0].url);
if (url.hostname === 'localhost') {
reject(new Error('Use DevTools to audit pages on localhost.'));
reject(new Error(STRINGS.localhostErrorMessage));
} else if (/^(chrome|about)/.test(url.protocol)) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Any firefox specific urls we need to include here now? firefox://page?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

just abouts i think

about:about
image

reject(new Error(`Cannot audit ${url.protocol}// pages.`));
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In Firefox, about: protocol pages don’t currently include the //.

} else {
Expand Down
11 changes: 9 additions & 2 deletions clients/extension/styles/lighthouse.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,13 @@ body {
margin: 2px auto 0;
}

.browser-brand {
display: none;
}
.browser-brand--__MSG_browserBrand__ {
connorjclark marked this conversation as resolved.
Show resolved Hide resolved
display: block;
}

.errormsg {
color: var(--color-blue);
font-weight: 500;
Expand Down Expand Up @@ -102,13 +109,13 @@ body {
padding-bottom: 10px;
}

.devtools-header {
.section-header {
font-size: var(--font-size);
font-weight: 500;
margin-bottom: 5px;
}

.devtools-note {
.section--description {
font-size: 14px;
color: grey;
}
Expand Down
7 changes: 6 additions & 1 deletion clients/test/extension/popup-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ const puppeteer = require('../../../node_modules/puppeteer/index.js');
const {DEFAULT_CATEGORIES, STORAGE_KEYS} =
require('../../extension/scripts/settings-controller.js');

const lighthouseExtensionPath = path.resolve(__dirname, '../../../dist/extension');
const lighthouseExtensionPath = path.resolve(__dirname, '../../../dist/extension-chrome');

const mockStorage = {
[STORAGE_KEYS.Categories]: {
Expand Down Expand Up @@ -68,6 +68,11 @@ describe('Lighthouse chrome popup', function() {
getManifest: () => ({}),
}),
});
Object.defineProperty(chrome, 'i18n', {
get: () => ({
getMessage: () => '__LOCALIZED_STRING__',
}),
});
}, mockStorage);

await page.goto('file://' + path.join(lighthouseExtensionPath, 'popup.html'), {waitUntil: 'networkidle2'});
Expand Down
2 changes: 1 addition & 1 deletion docs/releasing.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,7 @@ npm publish
# Publish viewer.
yarn deploy-viewer

# Publish the extension (if it changed).
# Publish the extensions (if it changed).
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Are there firefox specific instructions so that someone can release this? Or will that be handled in a follow up once this has landed and can be released for the first time?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I haven't uploaded to the FF store before, so IDK. I'll update when I do.

open https://chrome.google.com/webstore/developer/edit/blipmdconlkpinefehnmjammfjpmpbjk
cd dist/extension-package/
echo "Upload the package zip to CWS dev dashboard..."
Expand Down
3 changes: 0 additions & 3 deletions lighthouse-core/scripts/release/prepare-package.sh
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,9 +28,6 @@ yarn install
# Build everything
yarn build-all

# Package the extension
node build/build-extension.js package
exterkamp marked this conversation as resolved.
Show resolved Hide resolved

# Verify the npm package won't include unncessary files
npm pack --dry-run
npx pkgfiles
Expand Down
6 changes: 4 additions & 2 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,9 @@
"build-all:task": "(yarn build-cdt-lib & yarn build-extension & yarn build-devtools & yarn build-lr & yarn build-viewer & wait) && yarn build-pack",
"build-all:task:windows": "yarn build-cdt-lib && yarn build-extension && yarn build-devtools && yarn build-lr && yarn build-viewer",
"build-cdt-lib": "node ./build/build-cdt-lib.js",
"build-extension": "node ./build/build-extension.js",
"build-extension": "yarn build-extension-chrome && yarn build-extension-firefox",
"build-extension-chrome": "node ./build/build-extension.js chrome",
"build-extension-firefox": "node ./build/build-extension.js firefox",
"build-devtools": "yarn link && yarn link lighthouse && node ./build/build-bundle.js clients/devtools-entry.js dist/lighthouse-dt-bundle.js && node ./build/build-dt-report-resources.js",
"build-lr": "node ./build/build-lightrider-bundles.js",
"build-pack": "bash build/build-pack.sh",
Expand Down Expand Up @@ -179,7 +181,7 @@
},
"bundlesize": [
{
"path": "./dist/extension/scripts/popup-bundle.js",
"path": "./dist/extension-chrome/scripts/popup-bundle.js",
"maxSize": "15 kB"
},
{
Expand Down