@metamask/onboarding - npm Package Compare versions

Comparing version 0.4.0 to 1.0.0

dist/index.d.ts

 export default class Onboarding {
+    static FORWARDER_MODE: {
+        INJECT: "INJECT";
+        OPEN_TAB: "OPEN_TAB";
+    };
     private readonly forwarderOrigin;
@@ -3,0 +7,0 @@ private readonly downloadUrl;

dist/metamask-onboarding.cjs.js

@@ -67,9 +67,5 @@ 'use strict';
     CHROME: 'https://chrome.google.com/webstore/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn',
-    FIREFOX: 'https://addons.mozilla.org/en-US/firefox/addon/ether-metamask/',
+    FIREFOX: 'https://addons.mozilla.org/firefox/addon/ether-metamask/',
     DEFAULT: 'https://metamask.io',
 };
-var FORWARDER_MODE = {
-    INJECT: 'INJECT',
-    OPEN_TAB: 'OPEN_TAB',
-};
 // sessionStorage key
@@ -81,3 +77,3 @@ var REGISTRATION_IN_PROGRESS = 'REGISTRATION_IN_PROGRESS';
     function Onboarding(_a) {
-        var _b = _a === void 0 ? {} : _a, _c = _b.forwarderOrigin, forwarderOrigin = _c === void 0 ? 'https://fwd.metamask.io' : _c, _d = _b.forwarderMode, forwarderMode = _d === void 0 ? FORWARDER_MODE.INJECT : _d;
+        var _b = _a === void 0 ? {} : _a, _c = _b.forwarderOrigin, forwarderOrigin = _c === void 0 ? 'https://fwd.metamask.io' : _c, _d = _b.forwarderMode, forwarderMode = _d === void 0 ? Onboarding.FORWARDER_MODE.INJECT : _d;
         this.forwarderOrigin = forwarderOrigin;
@@ -102,3 +98,3 @@ this.forwarderMode = forwarderMode;
         window.addEventListener('message', this._onMessage);
-        if (forwarderMode === FORWARDER_MODE.INJECT && sessionStorage.getItem(REGISTRATION_IN_PROGRESS) === 'true') {
+        if (forwarderMode === Onboarding.FORWARDER_MODE.INJECT && sessionStorage.getItem(REGISTRATION_IN_PROGRESS) === 'true') {
             Onboarding._injectForwarder(this.forwarderOrigin);
@@ -177,3 +173,3 @@ }
         if (sessionStorage.getItem(REGISTRATION_IN_PROGRESS) === 'true') {
-            if (this.forwarderMode === FORWARDER_MODE.INJECT) {
+            if (this.forwarderMode === Onboarding.FORWARDER_MODE.INJECT) {
                 console.debug('Removing forwarder');
@@ -186,3 +182,3 @@ Onboarding._removeForwarder();
     Onboarding.prototype._openForwarder = function () {
-        if (this.forwarderMode === FORWARDER_MODE.OPEN_TAB) {
+        if (this.forwarderMode === Onboarding.FORWARDER_MODE.OPEN_TAB) {
             window.open(this.forwarderOrigin, '_blank');
@@ -232,2 +228,6 @@ }
     };
+    Onboarding.FORWARDER_MODE = {
+        INJECT: 'INJECT',
+        OPEN_TAB: 'OPEN_TAB',
+    };
     return Onboarding;
@@ -234,0 +234,0 @@ }());

dist/metamask-onboarding.es.js

@@ -65,9 +65,5 @@ import { parse } from 'bowser';
     CHROME: 'https://chrome.google.com/webstore/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn',
-    FIREFOX: 'https://addons.mozilla.org/en-US/firefox/addon/ether-metamask/',
+    FIREFOX: 'https://addons.mozilla.org/firefox/addon/ether-metamask/',
     DEFAULT: 'https://metamask.io',
 };
-var FORWARDER_MODE = {
-    INJECT: 'INJECT',
-    OPEN_TAB: 'OPEN_TAB',
-};
 // sessionStorage key
@@ -79,3 +75,3 @@ var REGISTRATION_IN_PROGRESS = 'REGISTRATION_IN_PROGRESS';
     function Onboarding(_a) {
-        var _b = _a === void 0 ? {} : _a, _c = _b.forwarderOrigin, forwarderOrigin = _c === void 0 ? 'https://fwd.metamask.io' : _c, _d = _b.forwarderMode, forwarderMode = _d === void 0 ? FORWARDER_MODE.INJECT : _d;
+        var _b = _a === void 0 ? {} : _a, _c = _b.forwarderOrigin, forwarderOrigin = _c === void 0 ? 'https://fwd.metamask.io' : _c, _d = _b.forwarderMode, forwarderMode = _d === void 0 ? Onboarding.FORWARDER_MODE.INJECT : _d;
         this.forwarderOrigin = forwarderOrigin;
@@ -100,3 +96,3 @@ this.forwarderMode = forwarderMode;
         window.addEventListener('message', this._onMessage);
-        if (forwarderMode === FORWARDER_MODE.INJECT && sessionStorage.getItem(REGISTRATION_IN_PROGRESS) === 'true') {
+        if (forwarderMode === Onboarding.FORWARDER_MODE.INJECT && sessionStorage.getItem(REGISTRATION_IN_PROGRESS) === 'true') {
             Onboarding._injectForwarder(this.forwarderOrigin);
@@ -175,3 +171,3 @@ }
         if (sessionStorage.getItem(REGISTRATION_IN_PROGRESS) === 'true') {
-            if (this.forwarderMode === FORWARDER_MODE.INJECT) {
+            if (this.forwarderMode === Onboarding.FORWARDER_MODE.INJECT) {
                 console.debug('Removing forwarder');
@@ -184,3 +180,3 @@ Onboarding._removeForwarder();
     Onboarding.prototype._openForwarder = function () {
-        if (this.forwarderMode === FORWARDER_MODE.OPEN_TAB) {
+        if (this.forwarderMode === Onboarding.FORWARDER_MODE.OPEN_TAB) {
             window.open(this.forwarderOrigin, '_blank');
@@ -230,2 +226,6 @@ }
     };
+    Onboarding.FORWARDER_MODE = {
+        INJECT: 'INJECT',
+        OPEN_TAB: 'OPEN_TAB',
+    };
     return Onboarding;
@@ -232,0 +232,0 @@ }());

package.json

 {
   "name": "@metamask/onboarding",
-  "version": "0.4.0",
-  "description": "Tools to support MetaMask one-click onboarding",
+  "version": "1.0.0",
+  "description": "Assists with onboarding new MetaMask users",
   "main": "dist/metamask-onboarding.cjs.js",
@@ -31,3 +31,3 @@ "module": "dist/metamask-onboarding.es.js",
   "dependencies": {
-    "bowser": "^2.5.4",
+    "bowser": "^2.9.0",
     "tslib": "^1.11.0"
@@ -46,4 +46,4 @@ },
     "static-server": "^2.2.1",
-    "typescript": "^3.9.2"
+    "typescript": "^3.9.5"
   }
 }

README.md

@@ -11,4 +11,4 @@ # MetaMask Onboarding
 
-* ES6 module: `import MetamaskOnboarding from '@metamask/onboarding'`
-* ES5 module: `const MetamaskOnboarding = require('@metamask/onboarding')`
+* ES6 module: `import MetaMaskOnboarding from '@metamask/onboarding'`
+* ES5 module: `const MetaMaskOnboarding = require('@metamask/onboarding')`
 * ES5 bundle: `dist/metamask-onboarding.bundle.js` (this can be included directly in a page)
@@ -18,58 +18,63 @@
 
-Minimal example:
-```
-const onboarding = new MetamaskOnboarding()
-onboarding.startOnboarding()
-```
+[See _§ Onboarding Library_ on the MetaMask Docs website for examples.](https://docs.metamask.io/guide/onboarding-library.html)
 
-Here is an example of an onboarding button that uses this library:
+## API
 
-```
-<html>
-  <head>
-    <meta charset="UTF-8">
-  </head>
-  <body>
-    <h1>Sample Dapp</h1>
-    <button id='onboard'>Loading...</button>
-    <script type="text/javascript" src="./metamask-onboarding.bundle.js"></script>
-    <script type="text/javascript">
-      window.addEventListener('DOMContentLoaded', () => {
-        const onboarding = new MetamaskOnboarding()
-        const onboardButton = document.getElementById('onboard')
-        let accounts
+Assuming `import MetaMaskOnboarding from '@metamask/onboarding'`, the following API is available.
 
-        const updateButton = () => {
-          if (!MetamaskOnboarding.isMetaMaskInstalled()) {
-            onboardButton.innerText = 'Click here to install MetaMask!'
-            onboardButton.onclick = () => {
-              onboardButton.innerText = 'Onboarding in progress'
-              onboardButton.disabled = true
-              onboarding.startOnboarding()
-            }
-          } else if (accounts && accounts.length > 0) {
-            onboardButton.innerText = 'Connected'
-            onboardButton.disabled = true
-            onboarding.stopOnboarding()
-          } else {
-            onboardButton.innerText = 'Connect'
-            onboardButton.onclick = async () => {
-              await window.ethereum.request({
-                method: 'eth_requestAccounts'
-              })
-            }
-          }
-        }
+### Static methods
 
-        updateButton()
-        if (MetamaskOnboarding.isMetaMaskInstalled()) {
-          window.ethereum.on('accountsChanged', (newAccounts) => {
-            accounts = newAccounts
-            updateButton()
-          })
-        }
-      })
-    </script>
-  </body>
-</html>
-```
+#### `MetaMaskOnboarding.isMetaMaskInstalled()`
+
+Returns `true` if a MetaMask-like provider is detected, or `false` otherwise. Note that we don't provide any guarantee that this is correct, as non-MetaMask wallets can disguise themselves as MetaMask.
+
+### Static properties
+
+#### `MetaMaskOnboarding.FORWARDER_MODE`
+
+A set of constants for each of the available forwarder modes.
+
+| Constant | Description |
+| :-- | :-- |
+| `INJECT` | Inject a `iframe` to that will refresh until MetaMask has installed |
+| `OPEN_TAB` | Open a tab to a new page that will refresh until MetaMask has installed—this is only useful if the client app has disallowed `iframes` |
+
+### Constructor
+
+#### `new MetaMaskOnboarding()`
+
+The constructor accepts an optional options bag with the following:
+
+| Option | Description |
+| :-- | :-- |
+| `forwarderOrigin` | Override the forwarder URL, useful for testing. **Optional**, defaults to `'https://fwd.metamask.io'`. |
+| `forwarderMode` | One of the available forwarder modes. **Optional**, defaults to `MetaMaskOnboarding.FORWARDER_MODE.INJECT`. |
+
+### Instance methods
+
+#### `startOnboarding()`
+
+Starts onboarding by opening the MetaMask download page and waiting for MetaMask to be installed. Once the MetaMask extension installation is detected, a message will be sent to MetaMask to register the current site as the onboarding initiator.
+
+#### `stopOnboarding()`
+
+Stops onboarding registration, including removing the injected `iframe` (if any).
+
+## Release & Publishing
+
+The project follows the same release process as the other libraries in the MetaMask organization:
+
+1. Create a release branch
+    - For a typical release, this would be based on `master`
+    - To update an older maintained major version, base the release branch on the major version branch (e.g. `1.x`)
+2. Update the changelog
+3. Update version in package.json file (e.g. `yarn version --minor --no-git-tag-version`)
+4. Create a pull request targeting the base branch (e.g. master or 1.x)
+5. Code review and QA
+6. Once approved, the PR is squashed & merged
+7. The commit on the base branch is tagged
+8. The tag can be published as needed
+
+## License
+
+This project is available under the [MIT license](./LICENSE).

src/index.ts

@@ -13,11 +13,6 @@ import * as Bowser from 'bowser';
   CHROME: 'https://chrome.google.com/webstore/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn',
-  FIREFOX: 'https://addons.mozilla.org/en-US/firefox/addon/ether-metamask/',
+  FIREFOX: 'https://addons.mozilla.org/firefox/addon/ether-metamask/',
   DEFAULT: 'https://metamask.io',
 };
 
-const FORWARDER_MODE = {
-  INJECT: 'INJECT' as const,
-  OPEN_TAB: 'OPEN_TAB' as const,
-};
-
 // sessionStorage key
@@ -30,2 +25,7 @@ const REGISTRATION_IN_PROGRESS = 'REGISTRATION_IN_PROGRESS';
 export default class Onboarding {
+  static FORWARDER_MODE = {
+    INJECT: 'INJECT' as const,
+    OPEN_TAB: 'OPEN_TAB' as const,
+  };
+
   private readonly forwarderOrigin: string;
@@ -35,7 +35,7 @@
 
-  private readonly forwarderMode: keyof typeof FORWARDER_MODE;
+  private readonly forwarderMode: keyof typeof Onboarding.FORWARDER_MODE;
 
   private state: keyof typeof ONBOARDING_STATE;
 
-  constructor ({ forwarderOrigin = 'https://fwd.metamask.io', forwarderMode = FORWARDER_MODE.INJECT } = {}) {
+  constructor ({ forwarderOrigin = 'https://fwd.metamask.io', forwarderMode = Onboarding.FORWARDER_MODE.INJECT } = {}) {
     this.forwarderOrigin = forwarderOrigin;
@@ -63,3 +63,3 @@ this.forwarderMode = forwarderMode;
 
-    if (forwarderMode === FORWARDER_MODE.INJECT && sessionStorage.getItem(REGISTRATION_IN_PROGRESS) === 'true') {
+    if (forwarderMode === Onboarding.FORWARDER_MODE.INJECT && sessionStorage.getItem(REGISTRATION_IN_PROGRESS) === 'true') {
       Onboarding._injectForwarder(this.forwarderOrigin);
@@ -126,3 +126,3 @@ }
     if (sessionStorage.getItem(REGISTRATION_IN_PROGRESS) === 'true') {
-      if (this.forwarderMode === FORWARDER_MODE.INJECT) {
+      if (this.forwarderMode === Onboarding.FORWARDER_MODE.INJECT) {
         console.debug('Removing forwarder');
@@ -136,3 +136,3 @@ Onboarding._removeForwarder();
   _openForwarder () {
-    if (this.forwarderMode === FORWARDER_MODE.OPEN_TAB) {
+    if (this.forwarderMode === Onboarding.FORWARDER_MODE.OPEN_TAB) {
       window.open(this.forwarderOrigin, '_blank');
@@ -139,0 +139,0 @@ } else {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

116257

increased by63.91%

Number of package files

12

increased by50%

Lines of code

3083

increased by222.83%

Number of low quality alerts

0

decreased by-100%

Number of lines in readme file

79

increased by6.76%

Dependency changes

• Updatedbowser@^2.9.0