Small bug for Firefox about live-css-editor HOT 7 CLOSED

Hi,

I'm more a king of beginner autodidact with JS but I digged a little bit more to find the causes of the problem.

From what I see there was 2 problem preventing the addon to be installed on Firefox:

First: I was using Firefox ESR 51 and some APIs needed for your addon were not included in Firefox ESR 51. So the solution should be to make your addon compatible for Firefox 54 and higher only.

Secondly: There was another small mistake that I see lot of time in WebExt there was no ID in the manifest.json so the addon was detected as "corrupt". The solution is just to add the ID in the manifest:

Here's a screenshot showing where to add it: http://i.imgur.com/9Fn8V1i.png

From what I've been told by other devs the Mozilla documentation don't talk about the ID being mandatory but it is from my experience, but when you use Firefox in "Dev mode" to test addon it is not mandatory so it is confusing... 😜

I never done a "push" before so I will not start here 😉 and also I don't know if you have to put your own ID in the manifest.

But from now it should be relatively easy to fix !

Wishing you a great Day !

from live-css-editor.

@mikhoul
Hi

Which version of Windows are you using?
If it is a small fix, would you be able to patch it yourself and send a Pull Request?

Otherwise kindly provide the steps to replicate.
Also, kindly share reference to any blogs/articles where I can understand more about this problem.

from live-css-editor.

Thanks a lot for the details you provided :-)

I have added the ID in the commit d58bf15 and updated to Magic CSS v5.5.9 which is now available in Mozilla add-ons store.

Let's hope this solves the issue.

The remaining part:
You mentioned "I was using Firefox ESR 51 and some APIs needed for your addon were not included in Firefox ESR 51. So the solution should be to make your addon compatible for Firefox 54 and higher only."

Do you mean that you were trying on Firefox ESR v51 initially where it didn't work and then you upgraded to v54 and it started to work?

You said "some APIs needed for your addon were not included in Firefox ESR 51"
Do you have any particular API as a suspect or was that a logical guess?
From the logs that you had initially provided, I don't believe those first 3 warnings would have been the cause. The other 3 warnings were apparently due to missing ID. I hope ID is the only issue.

Would you be able to try installing the latest version from the store on Firefox ESR v51 and if it works fine, you may close this issue :-)

from live-css-editor.

I tested it...

Good News and Bad news:

The good news is: The addon I've made with "Chrome Store Foxified" and your addon from the Chrome store work fine with Firefox 54. "It include an ID automatically when converting and generate a complete manifest too.

The bad news: Adding an ID in the manifest removed the problem generated from the lack of ID but leaved other problems there.

I reinstalled a portable version of Firefox ESR since I have upgraded my main Firefox version this morning.

So I tested the new version of your addon and it install fine, you can see the button on the toolbar but nothing happen when you press the button. In the console you see an error because "webextensions.storage.sync.enabled" is set to false by default in ESR. So I've set the pref to TRUE and agin it did not start leaving this error:
[Exception... "Component returned failure code: 0x80070057 (NS_ERROR_ILLEGAL_VALUE) [nsIDOMWindowUtils.loadSheetUsingURIString]" nsresult: "0x80070057 (NS_ERROR_ILLEGAL_VALUE)" location: "JS frame :: resource://gre/modules/ExtensionUtils.jsm :: runSafeSyncWithoutClone :: line 71" data: no]

I tried to find some info about this error but I found nothing meaningful at the I can understand 😞

Next Step with Firefox 54: It install fine since there is an ID in the manifest, we see the button on the toolbar but when the button is pressed nothing happen and there is errors in the console:

Unchecked lastError value: Error: No window matching {"all_frames":true,"matchesHost":["<all_urls>"]} ExtensionCommon.jsm:264
	withLastError resource://gre/modules/ExtensionCommon.jsm:264:9
	wrapPromise/< resource://gre/modules/ExtensionCommon.jsm:315:11

But even before this error there is other errors/warnings in the console when installing the addon but they are "minor" errors IMO , look at the complete screenshot: http://i.imgur.com/gM7lCpM.png

Next Step Installing the Foxied addon (taken from the ChromeStore) Everything work fine but there is some minor warnings in the console, here's a scrennshot: http://i.imgur.com/gQpv8ct.png

So my guess is there is something "wrong" in the Manifest of the addon on AMO to make it easier to find here's a link to the Foxied addon so you will be able to compare both to find where is the difference between the 2: https://dl.dropboxusercontent.com/s/2dp19yn9rnjotvq/Live%20editor%20for%20CSS%20and%20LESS%20-%20Magic%20CSS%20-%20Version%205.5.8%20-%20Foxified.xpi

With Firefox ESR I think there is some API or part of API that are missing that's would explain why the button don't work and the error in the console. IF you are able in AMO just write your addon work only with Firefox 54 and higher this way you will not receive bad review.

A things you can do with Firefox to help you is to use portable version from here to test them without messing with your main installation. Also you can use many portables Firefox version/instance at the same time: Copy the FirefoxPortable.ini from Other\Source next to FirefoxPortable.exe and set AllowMultipleInstances to true and you will be able to run many instance and it will be more easy to debug/test.

On my side I will try your addon more and come back later with some request to add some features to it, I see lot of potential here but I will take the time to use it and test it and I will be back to suggest you some new cool features that I foresee that should be relatively easy to implement,

Your addon editor look like some JS code I wrote to make a customized CSS editor in an addon, I did not finalize the project since the addon where I wanted to insert it was deprecated but I learned doing it and I have lot more to learn in JS 😉

Let me know if you need more information

from live-css-editor.

Thanks for the details :-) but unfortunately, I have not been able to reproduce the issue yet.

The combinations that I have tried are as follows:

OS:

• Windows 10 Enterprise Evaluation 64-bit (via VirtualBox)

Browser:

• Firefox 48+ (works fine)
• Firefox ESR 52.0.1 (https://ftp.mozilla.org/pub/firefox/releases/52.0.1esr/win64/en-US/) (works fine)

52.0.1 is the oldest ESR version that I could find from https://ftp.mozilla.org/pub/firefox/releases/ (Considering 48+ only)
I tried various other installable as well as portable versions of Firefox and didn't face the issue. Around one week ago, I was also able to successfully load the extension on Windows XP SP3 + latest Firefox combination as well.

Tried executing Magic CSS on:

• https://webextensions.org/ (works fine)

The Foxified version of Magic CSS also doesn't differ in any way which could cause any issue.

The error messages that you see related to "sync" settings in about:config are apparently inconsequential. Most of the other errors/warnings even I get to see but that doesn't block the execution.

My primary suspects are:

• Maybe the addon needs to be uninstalled and reinstalled after a Firefox restart
• Maybe a Firefox restart after installation would help (though it should not be the case)
• Maybe you need to open the webpage in a new tab and then run the extension
• Maybe you are trying to run it on a page where it is not loading due to a technical limitation or a bug. Can you check if the page where you are testing works fine with the Chrome version of the extension available at https://chrome.google.com/webstore/detail/ifhikkcafabcgolfjegfcgloomalapol ?
• Maybe there is some other unexpected issue due to Operating System + Firefox combination

Can you provide the complete set of steps to reproduce in the following format (please fill in the blanks):

• Use Windows version ___________
• Launch Firefox version __________
• Make sure that the Magic CSS extension is not installed already. If it was already installed, uninstall it and restart Firefox.
• Install the latest version of Magic CSS extension from the add-on store
• Go to https://webextensions.org/ in a new tab
• (Launch debugging console for the extension and clear the console)
• Click on the Magic CSS extension icon
• The extension does not run with the log showing _____________

from live-css-editor.

Maybe a Firefox restart after installation would help (though it should not be the case)

You were right, I also thought that we don't need to restart addon with WebExt and I tried it without really thinking it would change something and it worked. 😄

I was using Win7/64 but I don't think it change something wit Firefox.

Maybe just put a small note in AMO saying that in some special case you need to restart Firefox to enable the addon.

Thanks again @webextensions for this addon and I close the issue right now

from live-css-editor.

I have added some comments on the AMO page regarding this. And I hope it would be a rare issue since I could not replicate it in all my attempts.

Overall, I have added the applications.gecko.id and applications.gecko.strict_min_version (min version v48) that might help in some of the cases.

Thanks again for verifying 😄

from live-css-editor.