I have been developing a browser extension in vaniall JS till now. I would like to use vite + Vue moving forward. Upon doing a google search I found this GitHub repository which help with this.
I'm trying to set the user preferences and save them in storage using storage.sync. But when I use browser.storage.sync.get, I get below error
Cannot read properties of undefined (reading 'sync')
How to solve this? What is the correct way to use storage.sync with
webextension-polyfill or #types/webextension-polyfill
Below is the code is have using vanilla js with is woring perfectly
chrome.storage.sync.get({ 'testData': MyTestData }, result => {
console.log(result);
})
Below is the way to use storage.sync using webextension-polyfill
import browser from "webextension-polyfill";
browser.storage.sync.set({ 'testData': MyTestData }, result => {
console.log(result);
})
Related
I'd like to render GraphQL Playground as a React component in one of my pages but it fails due to missing file-loader in webpack. Is there a way to fix this in docs or do I need to create new plugin with new webpack config?
Is it good idea to integrate Playground and Docusaurus at all?
Thanks for your ideas...
A few Docusaurus sites have embedded playgrounds:
Hermes
Uniforms
In your case you will have to write a plugin to extend the webpack config with file-loader.
Not sure if you found a better way but check out: https://www.npmjs.com/package/graphql-playground-react
You can embed this react component directly in your react app - It looks like Apollo also uses the vanilla JS version of this
I just had exactly the same problem. Basically, Docusaurus with a gQL Playground Integration runs fine in local but won't compile due to errors when running yarn build as above.
In the end I found the answer is in Docusaurus, not in building a custom compiler:
I switched from using graphql-react-playground to GraphiQL: package: "graphiql": "^1.8.7"
This moved my error on to a weird one with no references anywhere on the web (rare for me): "no valid fetcher implementation available"
I fixed the above by importing createGraphiQLFetcher from '#graphiql/create-fetcher' to my component
Then the error was around not being able to find a window component, this was an easy one, I followed docusaurus docs here: https://docusaurus.io/docs/docusaurus-core#browseronly and wrapped my component on this page in like this:
import BrowserOnly from '#docusaurus/BrowserOnly';
const Explorer = () => {
const { siteConfig } = useDocusaurusContext();
return (
<BrowserOnly fallback={Loading...}>
{() => {
const GraphEx = GraphExplorer
return
}}
);
}
This now works and builds successfully
I was just wondering if there is a convenient way to cache an entire PWA on click? Just like you would download and install a native app from an app store?
If I am not wrong, the only solution currently is that you have to add all existing files in an array and use the cache.addAll method (as you see below). You can execute the function then if the button was clicked.
function downloadApp() {
caches.open(appCache).then(function(cache) {
return cache.addAll([
'/',
'/files/1',
'/files/2',
// ...
// All PWA files
]);
})
}
Do you know any better approaches for this?
I'm making an web app by using webpack, angularjs and bluebird.
I put this in my code:
{
"plugins":[
{
new webpack.ProvidePlugin({Promise: 'bluebird'})
}
]
}
But in developer console. Promise doesn't appear as a global variable. When I tried using it, console said: 'Promise is undefined'
Can anyone help me please?
Thank you,
I have been trying to create a Firefox add-on using the web extensions API. My add-on should take a screenshot of the current page the user is browsing using chrome.tabs.captureVisibleTab but it returns undefined. They say that its already implemented in the API on http://arewewebextensionsyet.com/ but I can't seem to get it to work.
Here is my code:
chrome.tabs.captureVisibleTab(null, {}, function(data) {
console.log("screenshotData: " + data);
});
I have also tried passing in a window.id as the first parameter even though in the docs it says its optional, but this also returns an undefined value for data.
Does anyone have any experience with this in particular?
It works for me in Nightly 49.0a1 (2016-06-04).
Make sure you have the following permission in your manifest.json file:
"permissions": [ "<all_urls>" ]
My drupal developer given a url like:http://feed.local/feed/services/rest/viewget/test.json
then am getting the out put as(when am browsing from chrome browser) below:
[{"nid":"133","node_title":"What is life really all about?"},{"nid":"139","node_title":"What went wrong?"}]
I am using sumitk tutorial that is how to develop iphone app using drupal as base system with titanium.
My problem is how can i parse the above in titanium .Can any one help.....
Or else If any one help me how can i use this in xcode........
You can use Titanium.JSON.parse
JSON.parse will help you, it is a function included by Titanium. Make sure you encapsulate it within a try {} catch(excp) {}
For example:
try
{
var data = JSON.parse('[{"nid":"133","node_title":"What is life really all about?"},{"nid":"139","node_title":"What went wrong?"}]');
}
catch (excp)
{
alert('JSON parse error');
}