By default IE 11 starts with some wired IE 7 settings (emulation mode) that brakes my JS and everything! 2 hours I try to fix this issues! I can go to developer toolbar F12 and there set the emulator to IE 10 and then it works.
I don't want to go every time in the developer toolbar and set that manually. And on top of that I have to keep the developer toolbar on in order to see the emulator IE 10 working fine!
I'm going nuts with this settings! How can I set IE 11 to start by default in IE 10 or 11 or whatever I want?
I don't think any of the IE setting lets you configure the default document mode. However, you can achieve this by code in your webpage.
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
Putting this line of code in head tag of your HTML ensures it always uses the latest version of IE.
Or
<meta http-equiv="X-UA-Compatible" content="IE=100" />
To use a specific version. IE 10, in this case.
Related
We have some performance issues with IE10/11. The following plunker explains some of our degrading performance while repeating table rows with custom elements.
Plunker Example
code
In this plunker example, we get a total of 68 ms in chrome to render the entire table.
In IE11 we get 280ms and see a 100% increase in render speed per row. While chrome do up to 3 rows per ms, IE does one every 2ms.
This plunkr is a basic model of our application. In our application we repeat the following template which is alot heavier. It involves style calculation and show/hide bindings depending on the users settings and permission level.
It's in swedish so don't mind the text.
The second row (expanded information) is if.bound so it's not drawn initially.
In our application, if we render a view with 100 rows of our template, chrome renders the entire table in 587 ms. IE11 does it in 3779ms. Edge does it in 1283ms, and Firefox 909ms.
Each row takes about 30ms in IE11,
Is there any reason IE11 should perform so much worse with the aurelia-template? What can we do to improve IE render speed? I have tried setting bindings to oneTime but that didn't do much. Is there something you should avoid doing in custom elements that doesn't work well with repeating and IE.
We want the custom elements because of reusability and code management since the template is pretty big.
Make sure you're using an up to date version of Aurelia, and make sure that you're using Bluebird if you need to support IE or older versions of Edge, as their Promise implementations are atrociously bad.
If you replace the index.html in your Plunkr with this:
<!doctype html>
<html>
<head>
<title>Aurelia</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles.css">
</head>
<body aurelia-app>
<h1>Loading...</h1>
<script src="//cdn.jsdelivr.net/bluebird/3.4.5/bluebird.min.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/node_modules/requirejs/require.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/config.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/bundles/babel.js"></script>
<script>
require(['aurelia-bootstrapper']);
</script>
</body>
</html>
Then the last row's draw time on my desktop is 278 ms in IE 11 on Window 10. See here: plunkr
I have posted an issue with the aurelia team
https://github.com/aurelia/polyfills/issues/39 and a github project https://github.com/4nderss/aurelia-performance-test reproducing my issues.
Aurelia team closed the issue so there might not be any fix for IE11 for now.
Edit: The aurelia team found an issue and it is now fixed
I have used the carousel example on Bootstrap3 to make a simple gallery website. On a desktop, it appears as I want, and shrinking the browser causes the navbar to collapse as expected. But it won't collapse on the phone. Instead the whole menu appears as a small version of the desktop view. From reading the docs, I thought it would start collapsed on the mobile view by default.
Since I followed the example code closely and all the bootstrap nav examples appear closed, I'm not sure what piece I'm missing. The site is up: http://artbymanisha.com
Add the following meta tag to in the <head> section.
<meta name="viewport" content="width=device-width, initial-scale=1">
I'm having a real hard time trying to trouble shoot this issue. I've seen others with the same problems but all seemed to find a fix, none of which work for my clients site. I've tried a number of different combinations but nothing works.
The site is completely responsive on desktop, android, and IOS6 / below, but after the release of IOS7 it no longer displays correctly on any of the IOS7 browsers and defaults to the desktop layout (although fits all on the screen, still not ideal). It's like it's ignoring the viewport settings for retina.
The website in question is www.grupoevents.com
I really appreciate any help as I've already spent hours trying to fix it!
This is probably the 6th variation of viewport I have tried now, still not working :(
What combinations have you used? I have used this in the past and it works for me.
<!-- standard viewport tag to set the viewport to the device's width, Android 2.3 devices need this so 100% width works properly and doesn't allow children to blow up the viewport width-->
<meta name="viewport" id="vp" content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width">
<!-- width=device-width causes the iPhone 5 to letterbox the app, so we want to exclude it for iPhone 5 to allow full screen apps -->
<meta name="viewport" id="vp" content="initial-scale=1.0,user-scalable=no,maximum-scale=1" media="(device-height: 568px)">
There is in fact an extra meta tag. Here it is and here's its id. <meta name="viewport" id="sv-meta" content="">
It doesn't show up on desktops, so it's probably being generated by this script <script type="text/javascript" src="http://grupoevents.com/wp-content/plugins/wp-simpleviewer/svcore/js/simpleviewer.js?ver=2.3.2.1"></script>. You should look into the settings for that plugin, but if you can't find any, then you might be able to use this javascript at the end of your header:
<script type="text/javascript">
var svMeta = document.getElementById('sv-meta');
if(svMeta){ svMeta.parentElement.removeChild(svMeta) }
</script>
I'm trying to test a site with Selenium Grid via recordings from Selenium Builder. Everything seems to work for Firefox and Chrome on Windows and Mac, but I'm getting error messages when testing in Windows 7 + IE11.
Whenever I try to select or interact with an element I get:
Exception: Unable to find element on closed window
HTML element I'm waiting for is loaded after page load via jQuery and appears on page as:
<input id="email" name="username" type="email" autofocus="autofocus">
Selenium Builder Step waits for it to appear before continuing:
{
"locator": {
"type": "id",
"value": "email"
},
"type": "waitForElementPresent"
},
From various posts of people with similar problems I have done the following to try and rectify:
Made sure the security zones were all the same in IE 11
Made sure I wasn't using any "FLAKY" options anywhere (INTRODUCE_FLAKINESS_BY_IGNORING_SECURITY_DOMAINS)
Should I be accessing elements in a different way? Or is there an IE 11 setting I'm missing?
According to the Selenium IE guide (https://code.google.com/p/selenium/wiki/InternetExplorerDriver) IE 11 has a known problem where security zones can cause issues even when they are all set correctly.
The best option is to downgrade from IE 11 to IE 10 (How to downgrade from Internet Explorer 11 to Internet Explorer 10?)
This solved this issue.
A while ago noticed this strange behavior with IE(Cant remember which version), using Selenium and C#:
When an element is clicked for the second time, the whole thing freezes.
My fix was to keep track of all clicked elements in order to avoid repeated clicks.
This fixed some of the issues I was having with IE.
Hope it helps.
We're using Selenium WebDriver to test a form that has a double-post prevention behavior. There's some simple javascript that disables the button upon click, so that users won't accidentally post the same thing twice.
How do we test this?
The issues is that the button.click() blocks until the next page has loaded, at which point we certainly can't assert anything about the button on the previous page. Even if we were to somehow get the .click() to be non-blocking, there's an inherent race condition; if the browser/javascript is much faster than the test system, it will be able to unload the page before the test can assert anything about the button.
Bonus points for solutions without javascript injection hacks.
Based on the assumption that Esc cancels page loading in every browser and OS, this should work:
WebElement input = driver.findElement(By.tagName("input"));
input.sendKeys(Keys.ENTER, Keys.ESCAPE);
Assert.assertFalse(input.isEnabled());
It sends Enter and Esc to the button in rapid succession, so that the JavaScript is fired, but the page load has no chance of kicking in. The only problem I can see is that you won't be able to get to the next page with this test unless you refresh and send a new form. But we should only test one feature at a time anyway, so you're fine ;-).
EDIT (to address your comment)
Actually, yes! You can try to se send a click and the Esc key at the same time via The Advanced User Interactions API (JavaDocs). You can also achieve a nonblocking click this way.
Anyway, this approach still sends two requests which isn't the fastest imaginable thing to do, but it (sometimes barely) passes my test, so you might give it a try:
WebElement input = driver.findElement(By.tagName("input"));
new Actions(driver)
.click(input)
.sendKeys(input, Keys.ESCAPE)
.perform();
Test environment: IE8 and FF18 with a locally stored file and Selenium 2.29.1; Win XP SP3.
The test file looks like this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Test</title>
</head>
<body>
<a href="http://google.com/">
<input type="button" value="Hello." onclick="this.disabled='true';" />
</a>
</body>
</html>