imgur-Extension
imgur-Extension copied to clipboard
Port to Firefox and Safari [$30]
I've done a bit of work on the firefox port here, simply rehosting and viewing images on the main.html page work fine, and the commit message details some of the current problems with the port that I noticed, but I'll list them again here:
- Automatically copying to clipboard does not work (though clicking copy on the main.html page does)
- The settings wheel in the top right of main.html doesn't do anything (however options can be accessed from the firefox extensions page)
- Rehosting to a specific album is somewhat weird, if I rehost to my computer, the rehosted image appears in both my computer and my account's views. I didn't test this too heavily however.
Awesome. Looks like you're also updating the Chrome version to be the latest - e.g. selected -> active, which is great.
Re: Clipboard - it looks like Firefox doesn't support it:
You can write to the clipboard like this in all execution contexts except background pages. In Firefox you can't select text or focus an input field in background pages, so you can't write to the clipboard from a background page.
So I'm happy to deprecate that feature for Firefox users until we can figure out a workaround.
Re: Settings wheel - This is because <dialog> isn't supported in Firefox but it looks like there's a polyfill.
Re: Rehosting - interesting. When you've got it stable I'll clone and play around. There's quite a lot of info in the console logs that might be helpful.
Good find on the polyfill, I had hacked a solution in the other day, but it required a flag in about:config, which is definitely not ideal. I implemented the polyfill solution here.
I'm doing my best to keep the extension supported in both chrome and firefox with the same code base, but with this code the chrome version will use the dialog-polyfill.css for dialog elements as well rather than whatever's built in. It looks the same either way though, so it probably doesn't matter.
Copying to the clipboard is my next priority, since I'm doing this port for the selfish reason that I switched to firefox and don't want to live without this extension, and that's a feature I really like. I've got a couple ideas I'd like to try before giving up on it at least, if nothing else an option to open a page with a copy link button that closes after pressing it might be better than pure deprecation.
I also noticed that when right clicking an image the rehost menu becomes nested, in an "Imgur community extension" context menu item, with an empty "imgur" item and the "rehost image" item. Simple fix there just add a context to the "imgur" item.
Off the top of my head maybe there's some loopback way we could do the clipboard: injecting a snippet of code onto the active tab and trigger the copy text there?
That's pretty much my ideal solution. I'll play with it for a bit, see how it goes.
Just to have it written down here's what for sure doesn't work right now:
- Copy Area
- Rehost to this computer rehosts to account
- Copy to clipboard
Cool. FYI in the dev branch I added a feature for when you're browsing the imgur galleries on imgur.com whereby it autoloads images in comments:
https://github.com/williamparry/imgur-Extension/blob/dev/src/js/inject/showImages.js
Looks like this works for copying to the clipboard. The check to figure out if it's running in firefox might be slightly overkill, but it works in both chrome and firefox still. I've got it to sort of a "good enough for me" point and while I do plan to work on it some more, it'll probably be a few days before I can dig into it and figure out the last two bugs I know of as well as merge the dev branch into it.
oh actually I just realized that it doesn't load more pictures when you scroll down. This bug is actually in chromium too, not sure about regular chrome. I had fixed this with the old Metronomik version like this. I suppose I should note now that I'm running Firefox 57 b5 and Chromium Version 61.0.3163.79 on Ubuntu 17.04 64 bit and those are where I've done 100% of my testing.
That clipboard code looks fine to me, and if most of the APIs are cross-browser with the odd variance then inline browser checks are fine.
With the loading, I haven't had a problem with regular chrome, but I'm happy to roll that fix in.
I'll clone your repo and test in FF today - cheers.
I got it running. There's a couple of things:
- That select box for albums is ugly af - we might have to write something custom for that
- The Tab capture doesn't handle retina: https://i.imgur.com/aiLNnCs.png, but I can look at that - probably just a dpi prefixing problem
When you're ready do you want to fold this into the main repo?
Sure, like I said, I'm going to be busy for a few days so I'll just send a PR with what I've committed so far which I think is a very good start.
Great - could you submit the PR to the dev branch rather than master?
Done.
That's one for your Hacktoberfest tally ;)
I wound up with a bit of time to look at the rehosting issue. The problem appears to be that since the extension has the <all_urls> permission, XMLHttpRequests are treated as same origin, which means cookies are sent even with xhr.withCredentials = false. I haven't had any luck preventing this behavior. The fetch api has an option to completely omit credentials, but it's not really a drop in replacement for XMLHttpRequest as request progress reporting is currently limited. We could probably hack around it by modifying headers in webRequest.onBeforeSendHeaders but that doesn't seem like the ideal solution to me.
Just confirming I'm getting that error too. I'll look into it also.
I've just committed a whole bunch of code and a new build system to help with firefox/chrome stuff, and changed the way it does auth.
I was investigating the webRequest stuff and I reckon we can just go with fetch. WebExtensions are only supported in latest Firefox and fetch has been in Chrome since 42. Are you OK to look at implementing it?
It might be connected to this issue: https://github.com/williamparry/imgur-Extension/issues/46
Yeah I'll take a shot at it as soon as I can
Great. I'm keen to push out a new version soon - do you think you'll get a chance over the next week to look at it?
I think this commit should do it. I don't have a ton of experience with promises so I'm not 100% sure if the inner promise's error will filter up to the outer promise's error handler or if I need a second catch in there. I'll be looking into that a bit more soon. I also only changed the unauthenticated model to use fetch,and left everything else to XMLHttpRequests since they seem to be working fine and have feedback for upload progress.
I did test with chromium 62, and while I don't experience #46 with my code, I can't log in to my account within the extension. For some reason the validate callback on line 629 of background.js isn't getting a url, so url.split is an exception.
I've also updated my fork with your latest changes, and it seems like Firefox at least needs the clipboardWrite permission in order to copy to the clipboard even with browser.tabs.executeScript.
With chromium, do you get the authentication popup?
With firefox clipboard, it looks like we'll need to ask for that permission on demand - I'm trying to limit as many initial permissions as possible.
Yeah the page pops up, I enter my email and password, if it's wrong it rejects it, if it's right the window closes and nothing happens and an error is logged in the console about not being able to call split on undefined. I tried opening the oauth url manually, and when I logged in, I got a json response from imgur saying that the redirect uri was invalid, so that's probably where I'd start.
The redirect depends on the application id - I just added a fixed key (like there is in Firefox) to the chrome manifest and updated the redirect uri for the imgur api app. Could you give it a whirl?
Perfect, that worked, thank you.
I was trying to get the granular permissions working for Firefox but it looks like it's currently broken on their end.
If you go to the permissions request page it says that it can be invoked from:
selecting its context menu item
However adapting their permissions example to include:
background.js
chrome.contextMenus.onClicked.addListener((obj, tab) => {
browser.permissions.request({permissions: ["history"]})
});
chrome.contextMenus.create({
"id": "test",
"title": "test",
"contexts": ["page"]
});
manifest.json
"permissions": [
"contextMenus",
"tabs"
]
Will give this error in the debug console:
win.PopupNotifications is undefined
FYI I'm on macOS High Sierra
Chrome version is ready for testing, but for Firefox we'll need to set up a proxy to handle the refresh token call since it needs the client secret to do it. If someone has AWS credits, we could set up a box to do it?