I currently have a Chrome extension that uses Chrome's APIs and plan on making a Microsoft Edge version once it opens up as well. My question is how do you work with the multiple API's?
For example, I use the following to check if the extension has just been installed or not:
chrome.runtime.onInstalled
I'm assuming for Edge it would be something like:
edge.runtime.onInstalled
What's the best way to work with both of these? Do I just duplicate the code within the file where there is a copy of the code for one and the other and presumably the browser will ignore the other browser's code? (doesn't sound like the good option)
Or is there some cross-browser framework that I should use instead?
Or is there some other solution?
And please forgive me, this is my first entry into building extensions/apps, I'm generally just a Web Designer.
Thank you!
All browsers support or
chrome.runtime.onInstalled
or
browser.runtime.onInstalled
So, the right way is to start scripts in your extension with this code:
var browser = browser || chrome
And then use browser, for example:
browser.runtime.onInstalled
(I'm sorry about my english)
Edit:
Chrome and Opera support chrome and not browser.
Firefox support chrome and browser.
Edge support browser and I don't know if it support chrome.
Anyway, my solution work in all browsers.
Update (5.8.16):
Edge support browser and not chrome.
Related
According to PhpStorm documentation:
Debugging of Vue.js applications is only supported in Google Chrome and in other Chromium-based browsers.
People like Jonathan Bossenger already tried to circumvent this dependency and make it work with Firefox anyway, but only to come with conclusion like:
Even if you try to edit the available list of browsers and enable Firefox it won’t come up as an option. Believe me, I tried!
Which lead to the question: what is integrated within Chrome/Chromium which is not present in Firefox, leading to this deficiency in development facility?
We used to support Firefox remote debugging (but without source maps) through the FireFox Remote run configuration, but our solution doesn't work in the latest Firefox versions due to changes in the protocol, and there doesn't seem to be an easy way to fix it. We've made some progress recently, but there are still some blocking issues.
Related tickets: WEB-45986, WEB-48076, WEB-2337
Prob 1 : Do I need to care about some bugs of Firefox 2, firefox 3, chrome7,8, opera 8,9... etc that can make my site look weird on these old browser ? I wonder if the developer changed the HTML-render-engine everytime they update their browser & make my site imcompatible with all version.
Will almost visitors keep their browser up2date ? If not, please suggest me with some tools that can help me test my site against FF, Chrome, IE, Opera, Safari in all major versions.
(I've try this by some online services but it's extremely slow to take screen shot of my site)
Prob 2 : Is there any difference among browser for PC, Tablet, Mobile (except the screen resolution) that can cause a display error for my website ?
Thanks a lot!
Well, whether you should test your website against:
all browsers: Yes, because Windows users have any among IE, Chrome, Firefox & in remote cases, Safari, Opera among others. Whereas Mac users will have Safari, Chrome as their preferred one.
all versions: Probably no. Limit yourself to only those which are still supported, i.e. IE 7 onwards & so on.
But, the key lies in the engine upon which the browser is based upon. It can be said:
*OS: Kernel :: Browser:Engine*
For instance, Chrome, Safari, both are based upon "webkit" layout engine.
Check out, web-layout engines: http://en.wikipedia.org/wiki/List_of_web_browsers
(This consideration will save a lot of effort as you can be rest assured that browsers using same engine will behave in a similar manner.)
Also, keep in consideration your target audience, this can help you limit your browser choices.
And yeah, most browsers have developer tools (F12 key), which allow you to simulate the previous versions of the browser.
But, all in all, the answer is relative & depends solely upon how much time you have & how much effort, time, testing are you willing to spend...
Developers should always try to make their websites cross browser compatible. I personally wouldn't worry about the very old versions of browsers (ie. Firefox 2) and would instead display a message telling the user that they should upgrade their browser.
As a lot of users don't always upgrade their browsers straight away, you should still try to maintain the compatibility of your site with these browsers.
I would recommend this tool for checking the browser compatibility of your website https://browsershots.org/
As a general rule there is a quick and dirty way to test your site. The dirty assumption is that if it works on IE, it will work in anything since IE handles more things differently than other browsers.
With that being said, you can test on IE by opening up an IE9 browser window and hitting F12. This will bring up a box on the bottom that allows you to check the site for compatibility quickly. On the top right hand corner of the box that popped up there are two drop down menus to change the IE engine that is interpreting the site (The one on the left is the Engine and the one right is compatibility mode that the engine is running). You can switch between IE7 engine to IE9 engine seamlessly and without needing a 3rd party application to do so.
I'm interested in doing some development against the Safari browser but I'm not sure if it's an open source project or not? I know webkit is open source but that doesn't mean the browser is.
I've emailed apple but they haven't been very responsive so I'm wondering if anyone on stackoverflow has any idea?
Safari is closed source. Only the Webkit portion is open source.
You may want to look at Konqueror, as it is the basis for Safari, and what you want to add may be added there, and if it gets into the trunk it may find it's way into Safari.
http://www.konqueror.org/features/browser.php
Chromium is also based on WebKit, the rendering engine behind Safari. If you want to look at a fully functional browser based on WebKit, Chromium is probably your best bet.
If my app has been tested in Firefox 3, Safari 3 & IE 7 will it need additional testing for Chrome?
If there are areas that'll need further testing -- then are there any online guides I could share with my designers & developers?
At what point will Chrome be considered to have sufficient market share to be treated as a mainstream browser?
If it's working fine on Safari, it will probably work on Chrome as well. The only difference is the JavaScript engine, but I've yet to see a real world example of some legitim JavaScript code not working on Chrome.
Personally I test my stuff with Chrome because I use Chrome intensively for development. It is good practice to test your pages with at least one WebKit (or KHTML) based browser though.
Chrome uses the WebKit rendering engine, which is also used in Safari and some other small browsers. Overall with both Chrome and Safari gaining in market share it is definately a browser to test (you only really need to test one). It's very standards compliant and is constantly having updates to keep up with new CSS drafts.
Webkits main Site - http://webkit.org/
Browser Market Share
http://www.w3schools.com/browsers/browsers_stats.asp and http://en.wikipedia.org/wiki/Usage_share_of_web_browsers are good places to look for market share of browsers although they show very different responses on Chrome.
According to Wikipedia roughly 7.96% of poeple are using WebKit based browsers however W3C shows that in November only 5.8% did.
Theoretically, because Google Chrome uses the same engine as Safari (WebKit), you've already tested. But Google has made several changes to the engine, including rewriting the JavaScript interpreter completely. Additional testing never hurts and it wouldn't take long to confirm that everything works as expected.
Now that GMail suggests people switch from IE to Firefox and Chrome, I'm guessing we'll see IE lose more and more market share to those browsers. Chrome doesn't have much of a user-base now, but I can imagine that will change.
Better test on it. I've already run across sites that work in Safari but don't in Chrome. I have IE8b2, FF3, Safari, and Chrome all installed on my machine. Not for testing reasons, but because of the websites that I visit. Takes all 4 of those to get all the websites to show right...
if you don't have PNG24 with opacity changed from CSS, all things should be fine.
However, i always try in all modern browsers (ie6/7, ff2/3, opera 9.x, safari and chrome).
According to Wikipedia, Chrome has a 0.78% usage rate right now. Depending on your audience the actual number of users might be low, and not really require testing.
Chrome uses the WebKit engine, which as I recall is the same engine used by Safari. So in theory, if your site works for Safari it should work for Chrome, as well.
Refer to this Google's Chrome page for details.
Chrome already got a small percentage of the community. However as far as I know, Chrome follows the standards from W3C and all websites that work in IE6, IE7 and FF2 / 3 has worked perfectly for me.
So by that said, i think you should already be testing your applications in chrome as well.
Always test in these browsers nowdays:
Internet Explorer 6, 7, 8
Firefox 2, 3
Chrome
Opera
Safari
Lynx
Tools like Selenium are good for testing user interactions on the web UI. However, I was curious what are people approaches for strictly testing and verifying that web pages are rendered correctly across a set of browsers?
Is this even possible?
May I recommend browsershots where you can submit pages and have them rendered out in a variety of browsers with various things set on or off such as Flash and JavaScript. At the end of the day you will still want to install FF, IE6-8, Opera and Safari/Chrome for testing manually. Also, if you've got a friend with a Mac (or a PC if you're using a Mac) get them to test in Safari too as I've personally found differences in the way both of them render the same page.
I'd also recommend that you develop mainly in Firefox and regularly check it in IE6 as you work. IE6 is the one that will mostly screw up so if it's working in both it's more likely to be working in all.
When you find rendering weirdness try and fix it in your markup and CSS first before resorting to CSS hacks as they can lead to 'interesting' problems later or in other browsers.
There is only a handful of browsers you need to test, as some share a common rendering engine (Gecko or Webkit). Without explaining which or why, here's the current wisdom (2009):
Build your site using Firefox or Opera (on any platform). BTW Opera uses its own Presto engine;
Test in whichever of the above you didn't use.
Validate the (X)HTML and CSS (important!).
Test it in >=IE7 and note the glitches, if any.
Use conditional comments in separate stylesheets for each version IE - never use CSS hacks as they'll go out of date.
Test in IE <7 if you like and do the same, or use conditional comments to ask users (politely) to upgrade their version of IE.
Test in Safari (Webkit).
Don't test in Chrome, you already have by proxy (Webkit)!
Don't test in IE for Mac - the share is too low and it's no longer updated.
Finally, try enlarging the text in Firefox, Opera, IE and Safari. Opera also has a hand-held emulation mode for mobiles.
You will have now covered (theatrical guess) 99.9% of browser setups. If you're on OS X or Linux, you can run Windows in a virtual environment like Parallels or Wine. Apparently Wine also has a Windows binary, but I couldn't find it. Caution: you'll need to be sure that your virtual environment allows IE to read conditonal comments.
In practice, I find that if a site has valid code and works in Firefox, Safari and Opera, it'll probably be okay in IE7 up. The only HTML/CSS gotcha is IE's 'haslayout' handling. If you don't have the browsers, BrowserStack is an excellent online testing service.
Finally, if you're using Javascript, you'll need to go through a similar process, problem being that as a rapidly developing area, newer versions of some browsers handle Javascript in increasingly effective ways, so functions in older versions might break or fail quietly.
If you just want to see if layout is correct, just submit your website to BrowserShots.org and visit later to see the screenshots.
If you want to test the functionality (JavaScript, etc.) then you'll need to test manually.
Manually?
I do not see an alternative if you want strict testing. Just install as many different browsers as possible and test in all of them. Of course this includes different versions of most popular browsers, and you need to check on Windows, Linux and Macintosh.
Previously I was use WM for different versions of IE, but I find out some new tool for testing layout, and UI as well with this tool, link for FF use fire bug extension, those tools are for manually testing.