firefox add-on use `Components` global lead to tests fails - firefox

I using JPM build the xpi package for firefox addon, but JPM insert a file bootstrap.js into xpi package automatically. It will lead to test fails when I submit addon to the addon developer hub. Extension tests info as following:
Access to the `Components` global
Warning: Access to the `Components` property is deprecated for security or other reasons.
bootstrap.js
const { utils: Cu } = Components;
const rootURI = __SCRIPT_URI_SPEC__.replace("bootstrap.js", "");

Related

Rollup and Apollo websocket with subscriptions-transport-ws

I'm trying to use:
Svelte (https://github.com/sveltejs/template) and
Svelte-Apollo (https://github.com/timhall/svelte-apollo).
Using Rollup (https://github.com/sveltejs/template/blob/master/rollup.config.js) for the final bundle when compiling (npm run build) I got this error:
Error: "Subcription is not exported by node_modules/subscriptions-transport-ws/dist/index.js"
So I thought of solving with (https://github.com/rollup/rollup-plugin-commonjs#custom-named-exports):
commonjs({
namedExports: {
'./node_modules/subscriptions-transport-ws/dist/index.js': ['SubscriptionClient']
}
}),
Now Rollup says:
index.js → public/bundle.js...
(!) Mixing named and default exports
Consumers of your bundle will have to use bundle['default'] to access the default export, which may not be what you want. Use `output.exports: 'named'` to disable this warning
(!) Missing shims for Node.js built-ins
Creating a browser bundle that depends on 'events', 'https', 'http', 'url', 'zlib' and 'stream'. You might need to include https://www.npmjs.com/package/rollup-plugin-node-builtins
(!) Unresolved dependencies
https://rollupjs.org/guide/en#warning-treating-module-as-external-dependency
events (imported by node_modules\ws\lib\websocket.js, node_modules\ws\lib\websocket-server.js, commonjs-external-events)
crypto (imported by node_modules\ws\lib\websocket.js, node_modules\ws\lib\websocket-server.js, node_modules\ws\lib\sender.js, commonjs-external-crypto)
https (imported by node_modules\ws\lib\websocket.js, commonjs-external-https)
net (imported by node_modules\ws\lib\websocket.js, commonjs-external-net)
http (imported by node_modules\ws\lib\websocket.js, node_modules\ws\lib\websocket-server.js, commonjs-external-http)
tls (imported by node_modules\ws\lib\websocket.js, commonjs-external-tls)
url (imported by node_modules\ws\lib\websocket.js, node_modules\ws\lib\websocket-server.js, commonjs-external-url)
stream (imported by node_modules\ws\lib\receiver.js, commonjs-external-stream)
zlib (imported by node_modules\ws\lib\permessage-deflate.js, commonjs-external-zlib)
bufferutil (imported by node_modules\ws\lib\buffer-util.js, commonjs-external-bufferutil)
utf-8-validate (imported by node_modules\ws\lib\validation.js, commonjs-external-utf-8-validate)
(!) Missing global variable names
Use output.globals to specify browser global variable names corresponding to external modules
events (guessing 'events')
crypto (guessing 'crypto')
https (guessing 'https')
http (guessing 'http')
net (guessing 'net')
tls (guessing 'tls')
url (guessing 'url')
zlib (guessing 'zlib')
bufferutil (guessing 'bufferutil')
stream (guessing 'stream')
utf-8-validate (guessing 'utf8Validate')
created public/bundle.js in 13.8s
What a mess. I'm just using web oriented libraries, why it complains about nodejs dependencies?!
So I added these lines in rollup.config.js:
import builtins from 'rollup-plugin-node-builtins'
import globals from 'rollup-plugin-node-globals'
...
plugins: [
globals(),
builtins(),
and all the previous errors are gone.
But now in browser I get:
Uncaught ReferenceError: exports is not defined
at client.js:45
It complains about this line (I think):
Object.defineProperty(exports, "__esModule", { value: true });
I'm totally lost.
I created a simple repo: https://codesandbox.io/s/zn1mnon8jl.
If you open it in codesandbox it works! Miracle! But if you download as a .zip and execute npm i && npm run dev you can see the problem.
What to do now?
Try adding this inline rollup plugin before the nodeResolve plugin
{
// needed to specifically use the browser bundle for subscriptions-transport-ws
name: 'use-browser-for-subscriptions-transport-ws',
resolveId(id) {
if (id === 'subscriptions-transport-ws')
return path.resolve('node_modules/subscriptions-transport-ws/dist/client.js');
},
},

web3 with NativeScript

How can I use the web3.js library (for Ethereum development) in NativeScript?
I tried:
install web3 via npm install web3#0.20.7 --save
install web3 through plugin manager in sidekick
even tried const Web3
=require('https://cdn.jsdelivr.net/gh/ethereum/web3.js/dist/web3.min.js');
also tried const Web3 = require("./web3.min.js"); with the web3.min.js file in the folder, but then console.log(Web3) just prints an empty array.
Also, I added the NativeScript plugin nativescript-nodeify
In the first three cases, I get an exception saying (amongst others) "Calling js method onCreate failed"
Note: I explicitly do not want to go via a back end to handle the interaction with Ethereum
I've been unable to make web3js work with NativeScript indeed. It looks like it is impossible, as web3 will use the browser to communicate with metamask for example.
Nervetheless, there may be a solution, using eth.js :
// in your root project directory
// NOT with nativescript sidekick !
npm install --save ethjs
tns plugin add nativescript-nodeify
// then, in your code
require("nativescript-nodeify");
const Eth = require('ethjs');
Then, you can interact with ethereum blockchain.
EDIT: The TNS plugin name is nativescript-nodeify

React-native importing throws 'Unable to resolve module', even though IDE finds it prefectly

Here is my test import I use in App.js
import {test} from './utils/configs';
Here is my ./utils/configs:
export const test = 'test-string'
App.js and Utils folder are in a same level. IDE finds import perfectly, but Xcode simulator throws error:
Unable to resolve module ./utils/configs from /Users/riku/Documents/StreamrLabs/streamr-ios-location-poc/App.js: The module ./utils/configs could not be found from /Users/riku/Documents/StreamrLabs/streamr-ios-location-poc/App.js. Indeed, none of these files exist:
/Users/User/Documents/Folder/projectname/utils/configs(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json)
/Users/User/Documents/Folder/projectname/utils/configs/index(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json)
It seems that importing new modules breaks Xcode/bundler. My app is detatched expo app.
Files should have an extension ! (configs.js in this case).
Xcode is trying to find .js files, and here, there is no extension !
(solution for record)

How to create a xpi file from scratchpad

I have developed my add-on in scratchpad environment and now developing is finished and I want to create final xpi file.
I replace only this:
Cu.import('resource://gre/modules/ctypes.jsm');
by this:
var {Cu} = require("chrome");
var{ctypes} = Cu.import("resource://gre/modules/ctypes.jsm", null);
Then using nodejs (jpm init and jpm xpi commands) I created xpi file however this is not worked properly.
What we did was follow the jpm tutorial: https://developer.mozilla.org/en-US/Add-ons/SDK/Tutorials/Getting_Started_%28jpm%29 and https://developer.mozilla.org/en-US/Add-ons/SDK/Tools/jpm#Installation
I did this on a Windows system:
we downloaded node.js
npm came with it
created a directory, in this directory i did jpm-init from command line
filled out the prompts then filled in the code for the addon:
We then created a similiar addon to this demo addon here:
https://github.com/Noitidart/jpm-chromeworker
I cant share the actuall addon as that was personal to the user. But the above is simpler and shows how to do it.
We did our jsctypes in a chromeworker, and have it communicate with index.js via messaging

JS Files not included in the Package created through CFX tool

I am developing a Firefox Add-On through CFX tool but while i am using cfx.xpi the Addon xpi is not having other Javascripts files which i am using as a thread ( using Worker ).
I am using :
var twrite = new Worker("t_write.js");
t_write.js is my worker file. But while executing it like this it is giving an Error: Malformed script URI:t_write.js
Please help me by letting me know how to include those files in the add-on package and what is this Malformed Scipt Error

Resources