@jbrowse/plugin-authentication 4.3.0 → 5.0.0-beta.2

package/esm/OAuthModel/model.js

@@ -1,280 +1,424 @@
-import { ConfigurationReference, getConf } from '@jbrowse/core/configuration';
+import { ConfigurationReference, readConfObject, } from '@jbrowse/core/configuration';
 import { InternetAccount } from '@jbrowse/core/pluggableElementTypes/models';
-import { isElectron } from '@jbrowse/core/util';
-import { types } from '@jbrowse/mobx-state-tree';
-import { generateChallenge, processError, processTokenResponse, toBase64Url, } from "./util.js";
-import { getResponseError } from "../util.js";
+import { isElectron, isSessionModel, localStorageGetItem, localStorageRemoveItem, localStorageSetItem, sha256Base64Url, toBase64Url, } from '@jbrowse/core/util';
+import { getRoot, types } from '@jbrowse/mobx-state-tree';
+import { OAuthLoginPrompt } from '../lazyLoginForms.js';
+import { getResponseError } from '../util.js';
+import { finishOAuthRedirect, finishOAuthWindow, getOAuthRedirectUri, parseOAuthError, waitForOAuthMessage, } from './util.js';
+function randomBytes(length) {
+    return globalThis.crypto.getRandomValues(new Uint8Array(length));
+}
+// Whether a popup opened right now would be one the browser lets through.
+// `in`, because the property is typed as always present but Firefox has no
+// implementation — and a browser that cannot answer gets the attempt.
+const hasTransientActivation = () => 'userActivation' in navigator ? navigator.userActivation.isActive : true;
+/**
+ * Puts the login window behind a click, for the flow that has no user
+ * activation to open one with — a session loading a track of an authenticated
+ * resource, which is every share link to one. Rejects if the user dismisses
+ * the prompt, and `getToken` drops the cached promise on a rejection so a
+ * later read asks again.
+ */
+function promptForLoginWindow({ internetAccountId, session, openLoginWindow, waitForToken, }) {
+    const blocked = new Error(`Could not open the ${internetAccountId} login window. Allow popups for this site and try again.`);
+    // an embedded root need not have a session to queue the prompt on, and a
+    // popup that never opens used to leave this promise pending forever — which
+    // `getToken` caches, so the account stayed wedged for the rest of the
+    // session with nothing shown to the user
+    if (!isSessionModel(session)) {
+        throw blocked;
+    }
+    return new Promise((resolve, reject) => {
+        session.queueDialog(doneCallback => [
+            OAuthLoginPrompt,
+            {
+                internetAccountId,
+                handleClose: (proceed) => {
+                    // opened before doneCallback, so the open still runs inside the
+                    // click whose activation it is spending
+                    const popup = proceed ? openLoginWindow() : null;
+                    doneCallback();
+                    if (popup) {
+                        resolve(waitForToken(popup));
+                    }
+                    else {
+                        reject(proceed ? blocked : new Error('OAuth login prompt was dismissed'));
+                    }
+                },
+            },
+        ]);
+    });
+}
+/**
+ * #stateModel OAuthInternetAccount
+ */
 const stateModelFactory = (configSchema) => {
     return InternetAccount.named('OAuthInternetAccount')
         .props({
+        /**
+         * #property
+         */
         type: types.literal('OAuthInternetAccount'),
+        /**
+         * #property
+         */
         configuration: ConfigurationReference(configSchema),
     })
-        .views(() => {
-        let codeVerifier = undefined;
-        return {
-            get codeVerifierPKCE() {
-                if (!codeVerifier) {
-                    const array = new Uint8Array(32);
-                    globalThis.crypto.getRandomValues(array);
-                    codeVerifier = toBase64Url(array);
-                }
-                return codeVerifier;
-            },
-        };
-    })
         .views(self => ({
+        /**
+         * #getter
+         * The config typed off the concrete schema. `ConfigurationReference`
+         * erases `self.configuration` to `any` (the reference's MST instance brand
+         * doesn't carry the schema's slot definitions), so reads go through this
+         * getter to recover per-slot types and slot-name validation.
+         */
+        get conf() {
+            return self.configuration;
+        },
+    }))
+        .views(self => ({
+        /**
+         * #getter
+         */
         get authEndpoint() {
-            return getConf(self, 'authEndpoint');
+            return readConfObject(self.conf, 'authEndpoint');
         },
+        /**
+         * #getter
+         */
         get tokenEndpoint() {
-            return getConf(self, 'tokenEndpoint');
+            return readConfObject(self.conf, 'tokenEndpoint');
         },
+        /**
+         * #getter
+         */
         get needsPKCE() {
-            return getConf(self, 'needsPKCE');
+            return readConfObject(self.conf, 'needsPKCE');
         },
+        /**
+         * #getter
+         */
         get clientId() {
-            return getConf(self, 'clientId');
+            return readConfObject(self.conf, 'clientId');
         },
+        /**
+         * #getter
+         */
         get scopes() {
-            return getConf(self, 'scopes');
+            return readConfObject(self.conf, 'scopes');
         },
-        state() {
-            return getConf(self, 'state');
+        /**
+         * #getter
+         * OAuth state parameter:
+         * https://www.rfc-editor.org/rfc/rfc6749#section-4.1.1
+         *
+         * Can override or extend if dynamic state is needed.
+         */
+        get state() {
+            return readConfObject(self.conf, 'state');
         },
+        /**
+         * #getter
+         */
         get responseType() {
-            return getConf(self, 'responseType');
+            return readConfObject(self.conf, 'responseType');
         },
+        /**
+         * #getter
+         */
         get refreshTokenKey() {
             return `${self.internetAccountId}-refreshToken`;
         },
+        /**
+         * #getter
+         * Extra parameters to add to the authorization request. Empty here;
+         * a provider that needs one of its own overrides this.
+         */
+        get authFlowParams() {
+            return {};
+        },
     }))
         .actions(self => ({
+        /**
+         * #action
+         */
+        // through the guarded helpers rather than `localStorage` directly: this
+        // runs on someone else's page in the embedded products, where reading the
+        // global at all throws if third-party storage is blocked. A refresh token
+        // that cannot be cached only costs an extra auth prompt; a throw here
+        // takes down the whole auth flow.
         storeRefreshToken(refreshToken) {
-            localStorage.setItem(self.refreshTokenKey, refreshToken);
+            localStorageSetItem(self.refreshTokenKey, refreshToken);
         },
+        /**
+         * #action
+         */
         removeRefreshToken() {
-            localStorage.removeItem(self.refreshTokenKey);
+            localStorageRemoveItem(self.refreshTokenKey);
         },
+        /**
+         * #method
+         */
         retrieveRefreshToken() {
-            return localStorage.getItem(self.refreshTokenKey);
-        },
-        async exchangeAuthorizationForAccessToken(token, redirectUri) {
-            const params = new URLSearchParams(Object.entries({
-                code: token,
-                grant_type: 'authorization_code',
-                client_id: self.clientId,
-                redirect_uri: redirectUri,
-                ...(self.needsPKCE ? { code_verifier: self.codeVerifierPKCE } : {}),
-            }));
-            const response = await fetch(self.tokenEndpoint, {
-                method: 'POST',
-                headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-                body: params.toString(),
-            });
-            if (!response.ok) {
-                throw new Error(await getResponseError({
-                    response,
-                    reason: 'Failed to obtain token',
-                }));
-            }
-            const data = await response.json();
-            return processTokenResponse(data, token => {
-                this.storeRefreshToken(token);
-            });
+            return localStorageGetItem(self.refreshTokenKey);
         },
-        async exchangeRefreshForAccessToken(refreshToken) {
+    }))
+        .actions(self => ({
+        /**
+         * #action
+         * POST a grant to the token endpoint and read the access token out of the
+         * answer. Both grants this account makes — trading the authorization code
+         * on the way in, trading the refresh token when the access token expires
+         * — are the same form-encoded request to the same endpoint answered by
+         * the same body, and OAuth 2 says so (RFC 6749 §4.1.3, §6). They differ
+         * in the grant's own parameters and in what a failure means, which is
+         * what stays at the call sites.
+         *
+         * @param grant - the grant-specific parameters; `client_id` is added
+         * @param describeError - turns a failed exchange into a message, and is
+         * where a grant does whatever invalidating its failure implies
+         */
+        async postTokenGrant(grant, describeError) {
             const response = await fetch(self.tokenEndpoint, {
                 method: 'POST',
                 headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-                body: new URLSearchParams(Object.entries({
-                    grant_type: 'refresh_token',
-                    refresh_token: refreshToken,
+                body: new URLSearchParams({
                     client_id: self.clientId,
-                })).toString(),
+                    ...grant,
+                }).toString(),
             });
             if (!response.ok) {
-                self.removeToken();
-                const text = await response.text();
-                throw new Error(await getResponseError({
-                    response,
-                    statusText: processError(text, () => {
-                        this.removeRefreshToken();
-                    }),
-                }));
+                throw new Error(await describeError(response));
             }
-            const data = await response.json();
-            return processTokenResponse(data, token => {
-                this.storeRefreshToken(token);
-            });
+            const data = (await response.json());
+            // Either grant may rotate the refresh token, and a provider that does
+            // so invalidates the old one — so this is not specific to the code
+            // exchange even though that is where one first arrives.
+            if (data.refresh_token) {
+                self.storeRefreshToken(data.refresh_token);
+            }
+            return data.access_token;
         },
     }))
         .actions(self => {
-        let listener;
-        let exchangedTokenPromise = undefined;
+        // Shared across concurrent exchangeRefreshForAccessToken calls so parallel
+        // 401s all wait on the same refresh request rather than each triggering a
+        // separate one.
+        let exchangePromise;
         return {
-            addMessageChannel(resolve, reject) {
-                listener = event => {
-                    this.finishOAuthWindow(event, resolve, reject);
-                };
-                window.addEventListener('message', listener);
-            },
-            deleteMessageChannel() {
-                window.removeEventListener('message', listener);
+            /**
+             * #action
+             */
+            async exchangeAuthorizationForAccessToken(code, redirectUri, 
+            // required, not optional: an omitted verifier is a silently
+            // PKCE-less exchange, and the caller running the flow is the only
+            // thing that knows whether this one used PKCE
+            codeVerifier) {
+                return self.postTokenGrant({
+                    grant_type: 'authorization_code',
+                    code,
+                    redirect_uri: redirectUri,
+                    ...(codeVerifier ? { code_verifier: codeVerifier } : {}),
+                }, response => getResponseError({ response, reason: 'Failed to obtain token' }));
             },
-            async finishOAuthWindow(event, resolve, reject) {
-                if (event.data.name !== `JBrowseAuthWindow-${self.internetAccountId}`) {
-                    this.deleteMessageChannel();
-                    return;
-                }
-                const redirectUriWithInfo = event.data.redirectUri;
-                const fixedQueryString = redirectUriWithInfo.replace('#', '?');
-                const redirectUrl = new URL(fixedQueryString);
-                const queryStringSearch = redirectUrl.search;
-                const urlParams = new URLSearchParams(queryStringSearch);
-                if (urlParams.has('access_token')) {
-                    const token = urlParams.get('access_token');
-                    if (!token) {
-                        reject(new Error('Error with token endpoint'));
-                        return;
+            /**
+             * #action
+             */
+            async exchangeRefreshForAccessToken(refreshToken) {
+                const inFlight = (exchangePromise ??= self.postTokenGrant({ grant_type: 'refresh_token', refresh_token: refreshToken }, async (response) => {
+                    // the access token this was going to replace is gone either way,
+                    // and an invalid_grant means the refresh token itself is spent
+                    self.removeToken();
+                    const { isInvalidGrant, statusText } = parseOAuthError(await response.text());
+                    if (isInvalidGrant) {
+                        self.removeRefreshToken();
                     }
-                    self.storeToken(token);
-                    resolve(token);
-                    return;
+                    return getResponseError({ response, statusText });
+                }));
+                try {
+                    return await inFlight;
                 }
-                if (urlParams.has('code')) {
-                    const code = urlParams.get('code');
-                    if (!code) {
-                        reject(new Error('Error with authorization endpoint'));
-                        return;
+                finally {
+                    // only if it is still ours: every awaiter of a shared exchange runs
+                    // this, and a later caller can have started its own between two of
+                    // them — clearing unconditionally then dropped that one from the
+                    // slot and let the next 401 open a second refresh in parallel
+                    if (exchangePromise === inFlight) {
+                        exchangePromise = undefined;
                     }
-                    try {
-                        const token = await self.exchangeAuthorizationForAccessToken(code, redirectUrl.origin + redirectUrl.pathname);
-                        self.storeToken(token);
-                        resolve(token);
-                        return;
-                    }
-                    catch (e) {
-                        if (e instanceof Error) {
-                            reject(e);
-                        }
-                        else {
-                            reject(new Error(String(e)));
-                        }
-                        return;
-                    }
-                }
-                if (redirectUriWithInfo.includes('access_denied')) {
-                    reject(new Error('OAuth flow was cancelled'));
-                    return;
-                }
-                if (redirectUriWithInfo.includes('error')) {
-                    reject(new Error(`OAuth flow error: ${queryStringSearch}`));
-                    return;
                 }
-                this.deleteMessageChannel();
             },
-            async useEndpointForAuthorization(resolve, reject) {
-                const redirectUri = isElectron
-                    ? 'http://localhost/auth'
-                    : window.location.origin + window.location.pathname;
-                const data = {
-                    client_id: self.clientId,
-                    redirect_uri: redirectUri,
-                    response_type: self.responseType,
-                    token_access_type: 'offline',
-                };
-                if (self.state()) {
-                    data.state = self.state();
-                }
-                if (self.scopes) {
-                    data.scope = self.scopes;
+        };
+    })
+        .actions(self => ({
+        /**
+         * #action
+         * Prove a token against the resource and, if that fails, refresh it once
+         * and prove the new one. Returns whichever token worked; throws if
+         * neither does. Every OAuth account validates this way and they differ
+         * only in what a probe is — a HEAD of the resource here, a metadata call
+         * for Dropbox and Google Drive.
+         *
+         * @param token - the token to prove
+         * @param probe - issues a request that succeeds iff the token is good
+         * @param describeError - turns a failed probe into a message
+         */
+        async validateTokenWithProbe(token, probe, describeError) {
+            const response = await probe(token);
+            if (response.ok) {
+                return token;
+            }
+            // Every path out of here leaves this token unusable, so drop it before
+            // taking any of them — that is what lets the next getToken re-prompt.
+            // Without it an account with no refresh token to fall back on (Google
+            // Drive's implicit flow issues none, and its access tokens last an
+            // hour) kept handing the expired token back out of getToken's cached
+            // promise: every later request threw this same error, and nothing
+            // short of a page reload ever asked the user to log in again.
+            self.removeToken();
+            const refreshToken = self.retrieveRefreshToken();
+            if (!refreshToken) {
+                throw new Error(await describeError(response, 'Error validating token'));
+            }
+            // Exactly once. Recursing here instead looped forever on a resource
+            // that fails for a reason no new token fixes — a file the account
+            // cannot see — refreshing against the token endpoint on every pass.
+            const newToken = await self.exchangeRefreshForAccessToken(refreshToken);
+            const retry = await probe(newToken);
+            if (!retry.ok) {
+                throw new Error(await describeError(retry, 'Error validating token'));
+            }
+            // removeToken above dropped the cached promise, so storing is enough
+            self.storeToken(newToken);
+            return newToken;
+        },
+        /**
+         * #action
+         * Opens the provider's auth page and returns a promise for the resulting
+         * token. For Electron, drives the flow directly via IPC; for web, opens a
+         * popup and waits for the redirect message.
+         */
+        async getTokenViaAuthFlow() {
+            // the slot defaults to '', and `new URL('')` reports only
+            // "TypeError: Invalid URL:" — say which account is unconfigured
+            if (!self.authEndpoint) {
+                throw new Error(`Internet account ${self.internetAccountId} has no authEndpoint configured`);
+            }
+            const redirectUri = isElectron
+                ? 'http://localhost/auth'
+                : window.location.origin + window.location.pathname;
+            // RFC 6749 §10.12: without a state there is nothing tying the redirect
+            // back to the request this window started, so a page that can post to
+            // us can hand us its own authorization. A configured state is a
+            // constant and so guessable — generate a per-flow nonce unless one was
+            // set explicitly. Providers are required to echo it back.
+            const state = self.state || toBase64Url(randomBytes(16));
+            // RFC 7636 §4.1 wants one verifier per authorization request, and this
+            // is the request — so it lives here rather than on the model, where a
+            // single lazily-created one was shared by every flow the account ever
+            // ran. `state` immediately above was already rotating for the same
+            // reason.
+            const codeVerifier = self.needsPKCE
+                ? toBase64Url(randomBytes(32))
+                : undefined;
+            const codeChallenge = codeVerifier
+                ? await sha256Base64Url(codeVerifier)
+                : undefined;
+            const data = {
+                client_id: self.clientId,
+                redirect_uri: redirectUri,
+                response_type: self.responseType,
+                state,
+                ...self.authFlowParams,
+                ...(self.scopes ? { scope: self.scopes } : {}),
+                ...(codeChallenge
+                    ? { code_challenge: codeChallenge, code_challenge_method: 'S256' }
+                    : {}),
+            };
+            const url = new URL(self.authEndpoint);
+            url.search = new URLSearchParams(data).toString();
+            const oauthParams = {
+                internetAccountId: self.internetAccountId,
+                expectedState: state,
+                exchangeAuthorizationCode: async (code, uri) => self.exchangeAuthorizationForAccessToken(code, uri, codeVerifier),
+                storeToken: token => {
+                    self.storeToken(token);
+                },
+            };
+            if (isElectron) {
+                // @ts-ignore - electron injects require onto window
+                const { ipcRenderer } = window.require('electron');
+                const electronRedirectUri = await ipcRenderer.invoke('openAuthWindow', {
+                    internetAccountId: self.internetAccountId,
+                    data,
+                    url: url.toString(),
+                });
+                // the main process resolves undefined when the user closes the auth
+                // window without completing the flow
+                if (electronRedirectUri === undefined) {
+                    throw new Error('OAuth flow was cancelled');
                 }
-                if (self.needsPKCE) {
-                    data.code_challenge = await generateChallenge(self.codeVerifierPKCE);
-                    data.code_challenge_method = 'S256';
+                const token = await finishOAuthRedirect(electronRedirectUri, oauthParams);
+                if (token === undefined) {
+                    throw new Error('Electron OAuth flow returned no token');
                 }
-                const params = new URLSearchParams(Object.entries(data));
-                const url = new URL(self.authEndpoint);
-                url.search = params.toString();
-                const eventName = `JBrowseAuthWindow-${self.internetAccountId}`;
-                if (isElectron) {
-                    const { ipcRenderer } = window.require('electron');
-                    const redirectUri = await ipcRenderer.invoke('openAuthWindow', {
+                return token;
+            }
+            else {
+                const openLoginWindow = () => window.open(url, `JBrowseAuthWindow-${self.internetAccountId}`, 'width=500,height=600,left=0,top=0');
+                // no await between the open and this listener, so the redirect
+                // message cannot be delivered before we are listening
+                const waitForToken = (popup) => waitForOAuthMessage(event => finishOAuthWindow(event, oauthParams), {
+                    popup,
+                    isOwnMessage: event => getOAuthRedirectUri(event, self.internetAccountId) !==
+                        undefined,
+                });
+                // A popup only opens while the page holds transient activation, and
+                // a session that loads an authenticated track has none — so the open
+                // is what trips the pop-up blocker, on a share link the user did
+                // nothing else to. Ask for the click that carries the activation
+                // instead, and don't spend the blocked attempt first where the
+                // browser will tell us there is no activation to spend.
+                const popup = hasTransientActivation() ? openLoginWindow() : null;
+                return popup
+                    ? waitForToken(popup)
+                    : promptForLoginWindow({
                         internetAccountId: self.internetAccountId,
-                        data,
-                        url: url.toString(),
-                    });
-                    const eventFromDesktop = new MessageEvent('message', {
-                        data: { name: eventName, redirectUri: redirectUri },
+                        session: getRoot(self).session,
+                        openLoginWindow,
+                        waitForToken,
                     });
-                    this.finishOAuthWindow(eventFromDesktop, resolve, reject);
-                }
-                else {
-                    window.open(url, eventName, 'width=500,height=600,left=0,top=0');
-                }
-            },
-            async getTokenFromUser(resolve, reject) {
+            }
+        },
+    }))
+        .actions(self => ({
+        /**
+         * #action
+         */
+        async getTokenFromUser(resolve, reject) {
+            try {
                 const refreshToken = self.retrieveRefreshToken();
-                let doUserFlow = true;
+                let token;
                 if (refreshToken) {
                     try {
-                        const token = await self.exchangeRefreshForAccessToken(refreshToken);
-                        resolve(token);
-                        doUserFlow = false;
+                        token = await self.exchangeRefreshForAccessToken(refreshToken);
                     }
                     catch (e) {
                         console.error(e);
-                        self.removeRefreshToken();
                     }
                 }
-                if (doUserFlow) {
-                    this.addMessageChannel(resolve, reject);
-                    this.useEndpointForAuthorization(resolve, reject);
-                }
-            },
-            async validateToken(token, location) {
-                const newInit = self.addAuthHeaderToInit({ method: 'HEAD' }, token);
-                const response = await fetch(location.uri, newInit);
-                if (!response.ok) {
-                    self.removeToken();
-                    const refreshToken = self.retrieveRefreshToken();
-                    if (refreshToken) {
-                        try {
-                            if (!exchangedTokenPromise) {
-                                exchangedTokenPromise =
-                                    self.exchangeRefreshForAccessToken(refreshToken);
-                            }
-                            const newToken = await exchangedTokenPromise;
-                            exchangedTokenPromise = undefined;
-                            return newToken;
-                        }
-                        catch (err) {
-                            console.error('Token could not be refreshed', err);
-                        }
-                    }
-                    throw new Error(await getResponseError({
-                        response,
-                        reason: 'Error validating token',
-                    }));
-                }
-                return token;
-            },
-        };
-    })
-        .actions(self => {
-        const superGetFetcher = self.getFetcher;
-        return {
-            getFetcher(loc) {
-                const fetcher = superGetFetcher(loc);
-                return async (input, init) => {
-                    if (loc) {
-                        await self.validateToken(await self.getToken(loc), loc);
-                    }
-                    return fetcher(input, init);
-                };
-            },
-        };
-    });
+                resolve(token !== undefined ? token : await self.getTokenViaAuthFlow());
+            }
+            catch (e) {
+                reject(e instanceof Error ? e : new Error(String(e)));
+            }
+        },
+        /**
+         * #action
+         */
+        async validateToken(token, location) {
+            return self.validateTokenWithProbe(token, probeToken => fetch(location.uri, self.addAuthHeaderToInit({ method: 'HEAD' }, probeToken)), (response, reason) => getResponseError({ response, reason }));
+        },
+    }));
 };
 export default stateModelFactory;