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
Related
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.
I use the Google Chrome remote debugging protocol to get benchmarking information of the page loading process with Google Chrome. I would like to switch to Opera which should offer the same functionality now that it runs on Chromium.
I started Opera with the cli parameters "--remote-debugging-port=9222 --enable-benchmarking --enable-net-benchmarking" similar to starting Google Chrome. I discovered that benchmarking seams not to be started in Opera - the chrome.benchmarking object is not visible to JavaScript.
I didn't find any documentation on the cli parameters for Opera, neither how to work with the remote debugging protocol in Opera.
Does anybody know how benchmarking can be enabled and/or the remote debugging protocol works in Opera?
Maybe you don't need this anymore, but I did today.
For some reason (maybe it's by design, but I didn't bother to check), you can't really start two separate instances of Chropera. Therefore, you first have to exit opera (from the menu to save your session).
Then, find your installation directory, and start Opera with the params:
C:\PROGRA~2\OperaNew\31.0.1889.174>opera --remote-debugging-port=9222 "http://www.opera.com"
(Maybe you can use launcher.exe, but I didn't bother checking)
Then, using another browser, visit http://localhost:9222. Maybe you can use the same one, but again, I didn't bother checking.
Now it's just the same as the Chrom(e|ium) protocol.
Hope that helps somebody.
I'm trying to run a different browser mode on IE with selenium using c#. Here's some code:
var ieWebDriver = new InternetExplorerDriver(#"PATHTOWEBDRIVER");
ieWebDriver.Keyboard.SendKeys(Keys.F12);
ieWebDriver.Keyboard.SendKeys(Keys.LeftAlt);
ieWebDriver.Keyboard.SendKeys("b");
ieWebDriver.Keyboard.SendKeys(Keys.NumberPad7);
I can open the developer tools (f12) but I'm not able to change the browser mode. Is IE preventing this due security? if so, are there any other ways to render content with a lower IE version?
thanks
No. The IEDriver is going to launch whatever IE is installed on the machine.
Changing the 'browser mode' is not a true representation of that version you are changing it to. IE9 on IE7 Standards Mode is not a true version of IE7.
Thus, you are stuck in a problem. You want to test different versions of IE, how do you do it?
The problem is that Windows let's you only have one IE version on a Windows PC at any one time. Yes, there are hacks and programs around to get multiple versions (IE5 and above) to run on a single machine, but they are hacks. Hacks which are not going to work all that well, and still, even with this, you wouldn't even be able to give the IEDriverServer the flexiblity to do this.
You will have to have seperate Windows machines.
A workaround, which again is a hack, is to set browser emulation mode in the registry, as documented in SO question.
Note that in the above question, the accepted answer is not going to work but the other answer may do. As note the comment on that answer, is by the maintainer of the IEDriver itself, advising strongly against this.
Another workaround, I have not tested, is perhaps use the native C# Keyboard.SendKeys, as documented here in MSDN. Am unsure if it will work (don't think anyone has ever ried it), but it is another option.
Selenium supports cross-browser testing of different versions of the same browser, but it is not achieved by switching the version in the Browser Mode in F12 Tools.
See https://code.google.com/p/selenium/wiki/Grid2
You can set up virtual machines with different versions of IE that work as Selenium nodes and use Selenium Hub to connect to them. Let's say you have a virtual machine with Windows 7 which has IE9 installed. You would start a Selenium node there and specify that it accepts requests for IE9 tests. You would then create InternetExplorerDriver for version 9, connect to the hub and run the test. The hub finds out the node with IE9 and runs the test there.
Related post here:
https://stackoverflow.com/a/8524216/1080590
This is of course different to what you're trying to do on a single machine, but it's more reliable and prevents you from extra management of your local IE instance.
I'm looking for an offline software that can speed up the testing of a website in different browsers.
Yes, I can install Opera, Firefox, Chrome, IE and Safari and test in each one, but this slow down the process because there are a lot of changes to be done in the website I am working and each change must be tested in all browsers.
More specifically, I am looking for something similar to IETester, but for different browsers. I'm not interested in online services (there are a lot), but offline.
So, someone knows something like this?
I find the Selenium tool [ http://seleniumhq.org/ ] very useful for such needs:
there are drivers for almost all modern and not-so-modern browsers: firefox, IE, Opera, Chrome, Safari..
scales quite well through the webdriver thing (remote control execution of tests on many different hosts), and
is well established: there are many resources available around to develop and deploy it.
Main drawback, as for my own experience: the learning curve is somewhat tough.
There is also a nice test management tool especially targeted at Selenium: Bromine (disclaimer: I did not yet use Bromine, but saw great comments on it).
Regards,
--
boris
Adobe BrowserLab for Desktop Browsers (Free) As noted in the comments, this has been discontinued. But they recommend Sauce labs, and Browser Stack instead.
Adobe Edge Inspect aka Shadow is also available and does all the above quite well. It is primarily for Mobile Browser testing and debugging.
Microsoft's Expression Suite also has its own Cross-Browser Testing utility, called Expression Web Super-Preview.
In Microsoft's words,
You can view browser renderings side-by-side horizontally or
vertically, or overlay them to identify differences. You can use
rulers and guides to measure and highlight visual problems. You can
zoom in and out of a page and see all the browser renderings update in
tandem.
You can try BrowseEmAll (http://www.browseemall.com) which is a desktop application for windows (and sadly windows online).
Still it contains all major browsers and simulators for iOS and Android which should make the testing easier than switching between different browsers manually.
If you like groovy, then try Spock.
I've experimented with Spock and Gem for BDD tests.
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.