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.

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

Add extension package that strips external JS loading #7766

Merged
merged 8 commits into from
Jan 24, 2024

Conversation

NhienLam
Copy link
Contributor

@NhienLam NhienLam commented Nov 9, 2023

Add an Extension package for developers to use when building a Chrome extension app.

This package strips the external JS loading to avoid violating Chrome Web Store's policy about remotely hosted code.
https://developer.chrome.com/docs/extensions/develop/migrate/improve-security#remove-remote-code

Copy link

changeset-bot bot commented Nov 9, 2023

⚠️ No Changeset found

Latest commit: 26634a4

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@NhienLam NhienLam marked this pull request as draft November 9, 2023 17:38
@google-oss-bot
Copy link
Contributor

google-oss-bot commented Nov 9, 2023

Size Report 1

Affected Products

  • @firebase/auth

    TypeBase (895d0cf)Merge (0c5a2d7)Diff
    browser177 kB177 kB+639 B (+0.4%)
    cordova205 kB205 kB-100 B (-0.0%)
    esm5230 kB231 kB+756 B (+0.3%)
    main174 kB174 kB-88 B (-0.1%)
    module177 kB177 kB+639 B (+0.4%)
    react-native194 kB194 kB+163 B (+0.1%)
  • @firebase/auth/cordova

    TypeBase (895d0cf)Merge (0c5a2d7)Diff
    browser205 kB205 kB-100 B (-0.0%)
    module205 kB205 kB-100 B (-0.0%)
  • @firebase/auth/internal

    TypeBase (895d0cf)Merge (0c5a2d7)Diff
    browser188 kB188 kB+639 B (+0.3%)
    esm5244 kB244 kB+756 B (+0.3%)
    main211 kB210 kB-84 B (-0.0%)
    module188 kB188 kB+639 B (+0.3%)
  • @firebase/auth/web-extension

    TypeBase (895d0cf)Merge (0c5a2d7)Diff
    browser?133 kB? (?)
    main?148 kB? (?)
    module?133 kB? (?)
  • bundle

    TypeBase (895d0cf)Merge (0c5a2d7)Diff
    auth (Anonymous)73.7 kB73.8 kB+41 B (+0.1%)
    auth (EmailAndPassword)81.6 kB82.0 kB+442 B (+0.5%)
    auth (GoogleFBTwitterGitHubPopup)100 kB101 kB+437 B (+0.4%)
    auth (GooglePopup)97.6 kB98.1 kB+437 B (+0.4%)
    auth (GoogleRedirect)97.8 kB98.3 kB+437 B (+0.4%)
    auth (Phone)84.0 kB84.4 kB+420 B (+0.5%)
  • firebase

    TypeBase (895d0cf)Merge (0c5a2d7)Diff
    firebase-auth-compat.js136 kB137 kB+385 B (+0.3%)
    firebase-auth-cordova.js174 kB174 kB-75 B (-0.0%)
    firebase-auth-web-extension.js?114 kB? (?)
    firebase-auth.js147 kB147 kB+537 B (+0.4%)
    firebase-compat.js780 kB780 kB+385 B (+0.0%)

Test Logs

  1. https://storage.googleapis.com/firebase-sdk-metric-reports/AAxpMIin1V.html

@google-oss-bot
Copy link
Contributor

google-oss-bot commented Nov 9, 2023

Size Analysis Report 1

This report is too large (92,343 characters) to be displayed here in a GitHub comment. Please use the below link to see the full report on Google Cloud Storage.

Test Logs

  1. https://storage.googleapis.com/firebase-sdk-metric-reports/LOM9Rct2bN.html

Copy link
Contributor

@hsubox76 hsubox76 left a comment

Choose a reason for hiding this comment

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

So sorry this is so complicated but you'll have to add the firebase entry points as well. That means, make a copy of the packages/firebase/cordova directory (index.ts and package.json), and add an entry in packages/firebase/package.json copying cordova here: https://github.com/firebase/firebase-js-sdk/blob/master/packages/firebase/package.json#L74. These can be an exact copy of cordova (with the word "extension") subbed in as it's all self-referencing within packages/firebase and not related to the bundles and paths you have created within the auth package. So you don't have to worry about extension-cjs and extension-esm2017 etc.

packages/auth/package.json Outdated Show resolved Hide resolved
packages/auth/extension/package.json Outdated Show resolved Hide resolved
packages/auth/package.json Outdated Show resolved Hide resolved
packages/auth/package.json Show resolved Hide resolved
packages/auth/package.json Outdated Show resolved Hide resolved
@NhienLam
Copy link
Contributor Author

Thanks Christina! I addressed your comments and added an extension entry point to firebase/auth.

packages/auth/extension/package.json Outdated Show resolved Hide resolved
packages/auth/package.json Outdated Show resolved Hide resolved
packages/firebase/package.json Outdated Show resolved Hide resolved
packages/firebase/auth/extension/index.ts Outdated Show resolved Hide resolved
@NhienLam NhienLam marked this pull request as ready for review December 5, 2023 00:59
Copy link
Contributor

@prameshj prameshj left a comment

Choose a reason for hiding this comment

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

LGTM except for a couple of small comments.

@@ -0,0 +1,8 @@
{
"name": "@firebase/auth/extension",
Copy link
Contributor

Choose a reason for hiding this comment

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

nit: maybe call this "chrome-extension"? extension would be interpreted to mean it is some additional auth functionality.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Ack. Renamed 'extension' to 'chrome-extension' here and other places (including folders' names). Thanks!

Choose a reason for hiding this comment

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

web-extension would be the preferred nomenclature. Since I presume we would want these to work in firefox and safari

Copy link
Contributor Author

Choose a reason for hiding this comment

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

While Firebase Auth only supports Chrome extensions currently, I changed it to 'web-extension' in case we support other web extensions in the future. Thanks!

Choose a reason for hiding this comment

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

absolutely understand, appreciate the update

packages/auth/extension/package.json Outdated Show resolved Hide resolved

import { ClientPlatform } from './src/core/util/version';

import { browserSessionPersistence } from './src/platform_browser/persistence/session_storage';
Copy link
Contributor

Choose a reason for hiding this comment

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

session storage does not work in chrome extension(https://developer.chrome.com/docs/extensions/reference/api/storage#usage only mentions local storage and doesn't recommend it). we could remove this.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Ack. Removed.

Choose a reason for hiding this comment

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

FWIW - you can't use localStorage by default, since it doesn't exist in service workers, but you can use chrome.storage, which does have session storage.

gapiScript: 'https://apis.google.com/js/api.js',
recaptchaV2Script: 'https://www.google.com/recaptcha/api.js',
recaptchaEnterpriseScript:
'https://www.google.com/recaptcha/enterprise.js?render='
Copy link
Contributor

Choose a reason for hiding this comment

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

Is ?render= needed?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Yes, I copied the exact url from https://github.com/firebase/firebase-js-sdk/blob/master/packages/auth/src/platform_browser/recaptcha/recaptcha_enterprise_verifier.ts#L35.

The full url we need to pass in _loadJS is 'https://www.google.com/recaptcha/enterprise.js?render=SITE-KEY'.

So if we remove '?render=' from here, we will have to update this line to be

url += '?render=' + siteKey;

@NhienLam NhienLam merged commit e929e3f into master Jan 24, 2024
43 of 44 checks passed
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

7 participants