native-ext icon indicating copy to clipboard operation
native-ext copied to clipboard

Documentation and examples of using the library

Open brunoais opened this issue 7 years ago • 11 comments

NS_ERROR_NOT_INITIALIZED: ext-windows.js:16
Security Error: Content at moz-extension://36992391-9267-48b9-bd8f-8882198f5ac0/node_modules/web-ext-utils/utils/icons/error.svg attempted to load moz-extension://36992391-9267-48b9-bd8f-8882198f5ac0/node_modules/web-ext-utils/utils/icons/%7B%7BiconUrl%7D%7D, but may not load external data when being used as an image.
Error: Invalid window ID: 191 ext-tabs-base.js
TypeError: runtime.connectNative is not a function

When the TypeError happened (my fault; I didn't set permissions for it to become available), no error is visible and the above appears in the logs. According to firefox, "error.svg" is trying to load another resource internally and that is getting blocked. The error.svg file has an <image> tag.

I'm using firefox 62.0b

brunoais avatar Jul 30 '18 21:07 brunoais

Hold on, I first understood this differently and thought there wasn't much to it.

The reason of the error is that node_modules/web-ext-utils/utils/icons/error.svg isn't meant to be used directly but is automatically read by JS code, modified (the extensions icon is inlined in place of the "url" to the icon that Firefox refuses to load here) and the composed icon is then used in the notifications. In your case, the icon was used directly (as a notification icon?).

Are you talking about the extension component? But how did that not have the nativeMessaging permission (which would cause the runtime.connectNative is not a function)? Or are you using the library component in your own extension?

The error notification function also logs the errors to the console. It may be interesting to know that.

NiklasGollenstede avatar Aug 04 '18 13:08 NiklasGollenstede

I'm trying to use the communication as it is exemplified in the README file and having quite many troubles with it, including it not working and me not getting any exception in my code. I'm not sure if that's library use or if there's some other way of communicating with it. I think this can clarify which way it is being used: As I'm still starting, I'm now trying to look at the example and at the re-style index.js file to try making it work.

When I first started by calling Native.requestPermission(), I was not getting the prompt window and I got an error as above. Adding nativeMessaging permission made that error go away. Now, the prompt for access appears as expected, I call Native.do..... Then, I get

TypeError: Native.require is not a function

Code:

 const fs = await Native.require(require.resolve('./fs.node.js'));

That code is just like in your example in the README file. The Native import is done like in Re-style with the same dependency to import and the same define function call.

brunoais avatar Aug 04 '18 14:08 brunoais

Ah. I thought this was a weird usage error. I am sorry for keeping you waiting.

The example was a bit outdated (or rather poorly updated). Here is a fixed version. Most importantly, see the use of process in the Native.do() block:

updated example

An example using the library:

npm i native-ext multiport web-ext-utils (and make the required files available in the packed extension)

const Native = await require.async('node_modules/native-ext/');

await Native.requestPermission({ message: 'Wanna do great stuff', });
// assume the NativeExt extension is set up and the user grants permission right away

const file = await Native.do(process => { // keep process alive until this function exits

	const fs = await process.require(require.resolve('./fs.node.js'));
	const file = await fs.readFile(somePath, 'utf8');

	fs.watch(someOtherPath, { }, onChange); // can even send callbacks
	await waitSomeTime();
	fs.unwatch(onChange); // remove listener after the connection closed

	return file;
});

function onChange(type, name) {
	console.log('File', name, type +'d');
}

./fs.node.js:

'use strict'; /* globals require, module, exports, process, Buffer, */

const { promisify, } = require('util'), promisifyAll = ...; // work with promises

const fs = promisifyAll(require('fs')); // any native module, 'ffi', 'browser' or any file included in the extension

// handle special case of `fs.watch`
const cb2watcher = new WeakSet, { watch, } = fs;
fs.watch = (path, options, callback) => {
	const watcher = watch(path, options, callback);
	ch2watcher.set(callback, watcher);
};
fs.unwatch = callback => {
	const watcher = ch2watcher.get(callback);
	watcher && watcher.close();
	ch2watcher.delete(callback);
}

module.exports = fs;

I will have a look into the error notification problem. If you were just using the native-ext library module, it could not have send that notification. It reports all errors through throwing/rejecting and events. (It would be the extension developers decision to display notifications.) Was the (failed) notification send by your extension or by the NativeExt extension?

NiklasGollenstede avatar Aug 04 '18 14:08 NiklasGollenstede

It was sent at my extension. I will try the updated code now.

brunoais avatar Aug 04 '18 15:08 brunoais

Syntax error in line 260; index.js: delete value['']; const error = new (typeof global[value.name] === 'function' ? global[value.name] : Error); that is inside the function unmapValue(value) {

image image

brunoais avatar Aug 04 '18 15:08 brunoais

I know that line of code, it is in the multiport module and definitely does not contain a syntax error. Even if value.name happens to be Function it won't throw a syntax error.

NiklasGollenstede avatar Aug 04 '18 16:08 NiklasGollenstede

Oh, wait. The error you see was re-created after serialization in that line. The actual SyntaxError will be somewhere in your node-side code. The original stack trace should be restored. I don't know why that is not the case for you.

NiklasGollenstede avatar Aug 04 '18 17:08 NiklasGollenstede

What would be the import for the promisifyAll variable in the NodeJs example?

brunoais avatar Aug 04 '18 17:08 brunoais

Give me one more hour and I will upload an actually working, documented example extension ...

NiklasGollenstede avatar Aug 04 '18 17:08 NiklasGollenstede

Here we go. You should probably have a look at the commit diff regarding fixed errors in the documentation. The example is in examples/1 and has its own description.

Feel free to ask further questions or report bugs (I rushed this a bit).

NiklasGollenstede avatar Aug 04 '18 18:08 NiklasGollenstede

Awesome! Thank you! I will go through this in the next hours and tomorrow!

EDIT: This is going very slow but not abandoned. Life just came and then holidays came.... I will come back to this next time I'm stable.... hopefully in the weekend next week

brunoais avatar Aug 04 '18 19:08 brunoais