Multi tool use

Clash Royale CLAN TAG

Accessing Cookies API from a React WebExtension

Summary

I'm trying to access the Cookies API from a WebExtension which uses React, but I don't know why, it throws a TypeException, as if browser.cookies did not exist.

browser.cookies

I've checked permissions and the code is copy/pasted from the MDN docs... but still I can't get it to work.

Exception:

TypeError: browser.cookies is undefined


Code

This is the main component:

import React from 'react';
import ReactDOM from 'react-dom';

class Popup extends React.Component {
constructor(props) {
super(props);
this.state = { sessionId: null };
}

componentDidMount() {
var getting = browser.cookies.getAllCookieStores(); // This throws "TypeError: browser.cookies is undefined"
getting.then(logStores);
}

render() {
return (
<div>
<h1>My App</h1>
</div>
);
}

logStores(cookieStores) {
for (let store of cookieStores) {
console.log(`Cookie store: ${store.id}n Tab IDs: ${store.tabIds}`);
}
}
}

ReactDOM.render(<Popup />, document.getElementById('app'));


And this is the manifest.json with the according permissions:

manifest.json

{
"manifest_version": 2,
"name": "MyApp",
"version": "1.0",

"browser_action": {
"browser_style": true,
"default_icon": {
"48": "images/Watermelon-48.png",
"96": "images/Watermelon-96.png"
},
"default_title": "MyApp",
"default_popup": "popup.html"
},

"permissions": ["browser", "cookies","<all_urls>","tabs"]
}


By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.