Getting empty storage in extension

[brendancallahan]

Hi, I have an Amplify/React website and I am trying to share login information with a Chrome extension, using the built in Amplify Cognito integration. Your package seems to be just what I need for this, but I can't seem to figure out how to use it. (I am new to chrome extensions and Amplify, so I'm sorry if this is a basic question.)

Here is my Chrome extension's background script:

import { Auth } from "@aws-amplify/auth"; 
import awsconfig from '../aws-exports';
import { registerExtensionStorage } from "@vocably/pontis";

const listener = (data) => {
    switch (data.payload.event) {
        case 'configured':
            const user = await Auth.currentAuthenticatedUser();  // "The current user is not authenticated"
            console.log('user:', user) 
            break;
    }
}
Hub.listen('auth', listener);

let storage = registerExtensionStorage("sync");

Auth.configure({
    ...awsconfig,
    oauth: 0,  // Oauth needs to be cleared here or else a "not supported" message is given
    storage: storage
});

And my manifest.json has

  "permissions": [
    "storage"
  ],

Here is the relevant part of my website code:

const extensionId = "my_extension_id";
let storage = new AppAuthStorage(extensionId);

Auth.configure({
    ...awsconfig,
    storage: storage
});

On the website, I pass aws-exports to Auth.configure along with the Pontis custom storage, which seems to be working fine there. I can see via breakpoints that the AppAuthStorage is setting and getting values successfully from Amplify auth.

But when I try it out on the Chrome extension, the storage appears to be empty. If i try to load the user, I always get an error that the user is not authenticated.

If I do something like this to dump the contents of the storage, it also appears to be empty:

chrome.storage.sync.get(null, function(items) {
    var allKeys = Object.keys(items);
    console.log('All chrome storage keys: ' + allKeys);
});

I'm not sure how to get the storage "synchronized" between the site and the extension. Please let me know if I'm doing anything wrong here, or if I can give any more information or run any tests to make the issue more clear. Thanks!

[sneas]

Hey @brendancallahan, your setup looks good to me. I'm not sure about the part with oatuh: 0, though.

I've just checked my setup, and you'll probably also need something like

"externally_connectable": {
  "matches": ["https://*.your-domain.com/*"]
},

in your manifest JSON. Where your-domain.com is the domain of your website.

Just to make sure we're on the same page, what version of the manifest are you using?

[brendancallahan]

That fixed it, thanks for your help! I must have missed this in the extension documentation. Everything is working great now.