olsh/Feedly-Notifier-Firefox

Turn into WebExtension (merge with olsh/Feedly-Notifier )

Daktyl198 opened this issue · 17 comments

With Firefox 48 being released, I'm pretty sure WebExtensions (or at least a stable portion of the API) is now available to the masses. As WebExtensions are heavily based on Chrome extensions, I think that with just a few minor tweaks that version of the addon should work fine (the addon doesn't do too much inside the browser window, right?)

I used Chrome Store Foxified to test the Chrome version vanilla and the button/popup showed up and worked, but I couldn't get the google account authentication working so I couldn't test past the green "login" button.

olsh commented

@Daktyl198 👍
I tried to use WebExtensions API on nightly builds with no success (options page didn't work).
Will try with stable, thanks for the reminder.

Yeah, the options page was something I was wondering about. I haven't looked too deep into it, but even if it doesn't have exactly the same API as Chrome, I'm sure WebExtensions allows opening chrome:// urls, which you could use for settings: e.g. uBlock Origin.

The only downside is that you'd then have to add a button within the popup for navigating to said page. To the left of the "Open All Feeds" button wouldn't be so bad, but I'd be worried about such a big change in user experience for people that have been using it a while.

olsh commented

I haven't looked too deep also, but I hope there is API or something to add items to context menu.

https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Implement_a_settings_page

Looks like you don't need to add a context menu, it'll just work the same as always for the user. You just have to add the URI of the settings page to the manifest.json and it'll pop up as a "Preferences" button in the about:addons page the same as usual.

That being said, based on the example it looks like you won't be able to re-use the same settings page as you use on Chrome, so that's a bummer.

A minimum edit to the manifest.json you could do just to see what else needs to be done is to add:

// @if BROWSER='firefox'
   "applications": {
      "gecko": {
         "id": "olsh.me@gmail.com"
    }
    "options_ui": {
       "page": "options.html"
    },
// @endif

As Firefox will completely ignore the 'options_page' key and install just fine, based on my experiences with installing the Chrome version.

All that being said, you still have to figure out how to grab the google authentication so we can log in ^.^

olsh commented

@Daktyl198
Great, thanks for the info.
If I remember correctly, I had no big problems with Google Auth when played with nightly builds.

Just a quick update: it's not a problem with google auth. I haven't tested my theory, but it seems to be a problem with the fact that Firefox doesn't yet support chrome.storage.sync. I've only glanced at the code, but do you use that anywhere to store the Feedly auth token? And if so, do you know of any alternatives?

(side-note, I got the config page working, but there's no text and the styling is nasty lol)
(side-side-note, I missed a closing bracket in that "applications" section, so don't copy/paste)

olsh commented

Well, I've started work on the task already, and resolved this problem.
You can try to build extension from this branch.
https://github.com/olsh/Feedly-Notifier/tree/firefox-web-extensions
grunt sandbox --clientId=sandbox --clientSecret=CNKEATM7ICEGVOZ3P5A1 --browser firefox

There are two problems that I didn't solve yet:

  • Options page
  • Popup style (it adds scrollbars)

It seems that everything else works properly.

I'm probably not being helpful at this stage, but here's what I get:
running grunt with those options, I go to about:debugging and load the build/manifest.json file as a temporary addon.

Trying to open the popup, it's stuck at the loading icon. Looking at the debugger, I see "ReferenceError: $ is not defined" and pointing to $(document).ready(function () { in popup.js every time I press the button.

I feel it's worth nothing that I'm trying to do this on Nightly (v51), not on 48 stable.

olsh commented

@Daktyl198
Sorry, I completely forgot that you have to run bower install first.

olsh commented

And I've just pushed a commit that fixes sandbox redirect problem. Please update.

Hmm. I re-cloned/built/etc after you pushed that commit and I'm still getting a redirect error:
{"errorCode":400, "errorId":"sandbox-he.--numbers here--", "errorMessage":"invalid redirect_uri"}

olsh commented

When you click login link, what is in the url after redirect uri parameter?
redirect_uri=http://localhost

Also, do not forget to reload extension in FF.

The options_page key in manifest is wrong: https://github.com/olsh/Feedly-Notifier/blob/firefox-web-extensions/src/manifest.json#L28

It's options_ui: https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/options_ui

You are welcome.

Edit: just realized options_page works in Chrome, but not Firefox.

olsh commented

Thanks @jgpacker
Will try it.

@olsh Turns out I was on the wrong branch (could have swore I did a checkout first... woops).

The basic functionality is there. The two biggest things I noticed were:

  1. The tab hosting the redirect to localhost stays open on successful login. I assume this is because it's where the first-run page is supposed to go
  2. It actually DIDN'T spawn scrollbars for me... because I couldn't scroll the content. The popup was completely static, even though I could see a couple items below the bottom edge.