I have a knockoutjs app which has been running smoothly for years now. The browser receives a message via SignalR and then is rendered by Knockoutjs.
Now if you run the app in Microsoft Edge, the same fields are not updating on screen where as other fields are updating. It is always the same fields that update once, then never update again. If you inspect the DOM then you can see this being changed.
After a lot of process of elimination, I have actually discovered that the issue seems to be caused by 1 line of css
html { text-transform: uppercase; }
I have put together a small demo of this bug which you can then run in Chrome/FF/IE9/IE10 vs Edge. Run the code in Edge with the style applied, then comment it out to see the values updating.
http://jsbin.com/baqozusuge/edit?html,css,js,console,output
Link to code on github https://gist.github.com/anonymous/de7610c341e6ee737d8290eb608afb57
Anyone any idea what the heck is going on with this?! It seems as though Microsoft Edge is deciding to cache the display based on the similarity of the value currently displaying.
This is officially a Microsoft bug so something that cannot be "fixed" through code. https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/7451374/
Related
I want to know what disabling CSSOM View Scroll Coordinates flag in chrome://flags does and how can i replicate this behavior using code in my ReactJS app.
Additional information :
It seems after Chrome 85 update, ag-grid RTL support breaks and the grid is not able to scroll the content and sometimes the cells becomes white, i had to dig very deep into the past questions and try a lot of far fetched solutions to find what i have.
I found out that disabling CSSOM View Scroll Coordinates in chrome://flags will fix the bug!~ but the problem is i don't want to force my users and teach them to do this just so my app works, so i thought what ever disabling CSSOM View Scroll Coordinates does, maybe i can replicate it using css code or some other code
I have already reported this issue in ag-grid's git-hub but i'm still waiting for them to offer a solution in the mean time if i can get this to work only using code, it would be great as i have a lot of users which are not able to use my app just because of this simple bug ..
Thank you.
I'm using Firefox developer edition, trying to debug a page (html+javascript) in a frame.
With Firefox 33, in the debugger section I can see the source code of the page inside the frame, activate breakpoints...
My problem with developer edition is that it doesn't show the html code of the page, although it is selected in the left side of the toolbar. It shows some html code, but it's not from the selected page. I can't locate where is it from.
Is there a way to have the same behaviour in debugger for firefox 33 and developer edition?
Thanks in advance, best regards
This is what GC does to you
Short answer, the HTML of the frame was being garbage collected away by the browser engine. This happens when the page/html has no script active on it which has still some work left to do.
This can be otherwise prevented by holding a strong reference to any object in the page and putting it somewhere where the browser thinks that its still being used.
For example,
window.foobar = some_object_from_the_page
will work.
Here is the root cause and a potential & partial fix is coming up in near future.
I'm using the Selenium 2.0 web drivers to try and login to a page. The following code works with the Firefox webdriver just fine, it finds the fields, fills them in and clicks the button.
driver.FindElement(By.Id("UserName")).SendKeys("name");
driver.FindElement(By.Id("Password")).SendKeys("test");
driver.FindElement(By.Id("btnLogin")).Click();
However, whenever I try to use the internet explorer webdriver it says it is unable to find the element with id == UserName. I tried using By.Name, and By.Xpath as well with valid inputs but I still get the same error saying it can't find the element. I am using IE 9 so I'm aware it may be a compatibility issue, however I can't seem to find any posts or information saying there is a known issue.
I just wanted to see if anyone else was experiencing the same issue, or if there is something I'm not doing correctly that is causing my issue. Also, this is a C# .NET project.
-- Edit --
Apparently it is an issue with IE9, I removed 9 and went back to 8 and the test works. I'm still interested to know if anyone finds out why this happens or if there is a work around.
The current release of Selenium (2.0b2) does not support IE9, however 2.0b3 should be released soon and supports both IE9 and Firefox 4.
This answer may also be relevant for anyone experiencing issues getting 'clicks' to fire with IE9.
A workaround to this is to send a .Click() to another element on the page, so that the browser gets the focus, before attempting to click the link, e.g. it's parent:
driver.FindElement(By.Id("Logout")).FindElement(By.XPath("..")).Click();
driver.FindElement(By.Id("Logout")).Click();
I am trying to debug a large and complex webapp that makes heavy use of DIVs, AJAX, dynamic HTML and server-side code to do its job.
Under normal operation we do not have problems. However, when we put the webapp into an IFRAME, certain functions trigger a crash in IE7 that renders the browser inoperable (all CPU used).
What tools exist to help track down what could be happening? Loading the IE process into the debugger gives me all sorts of fascinating info about the registers, but I think the issue is in javascript.
We have tracked down one problem with the app already that involved incorrect reparenting of an element (something attached itself to window. instead of document.)
I wrote a test IFRAME page that dumps the innerHTML of the iframe into a textarea, so it can be compared during various states, but that only shows me static attributes, I can't tell what sort of javascript events are associated with elements or determine if a handler is firing out of turn.
IE8, Firefox, Chrome etc do not have the same behaviour.
Ideally I'd like something that would let me snapshot the DOM (or the javascript VM?) during a known good state, then "just before it happens" so we can figure out what's added / removed / missing / different. What is out there?
Update: I'm now trying to use the IE Developer Toolbar to track it down.
Update 2: The IE7 crash occurs following this AJAX code:
function Sys$UI$Control$get_element() {
/// <value domElement="true" locid="P:J#Sys.UI.Control.element"></value>
if (arguments.length !== 0) throw Error.parameterCount();
return this._element;
}
The return this._element; line is the last thing that happens before I lose IE.
IE Developer's Toolbar. Download it here (IEDevToolBarSetup.msi).
For JavaScript debugging refer this blog.
Some guy made a bundle that's called Internet Explorer Collection. It includes some 6 different IE browsers ranging from IE6 to IE8 in different builds. All those include Firebug (really, it sort of works) and Internet Explorer Developer Toolbar.
It was really helpful for me to debug IE7 issues.
see this link.
By placing 'debugger' in the javascript files in places where you'd like to start debugging you can debug the javascript in visual studio as well complete with trace, call stacks, etcetera.
The IE developer toolbar definitely helps alot. Visual Studios's debugger is also very good if you can get a machine with VS and IE7 on it.
DynaTrace is a profiling tool for IE7. However, it provides a great deal of information (including JS stacks), so it can also be very helpful for debugging.
IE 7 and IE 8 has built in debugging tools. Press F12 and you are ready to debug. Also firebug-firefox and chrome's inspect element options are useful/
I have a modified version of a flex calendar found Here, and though it looks alright on most computers I've seen, there is a problem on two of the three servers here. Because of the way Citrix is setup here, I need to have it functional on all of the servers.
When it loads, everything is stretched out vertically, and the numbers are missing on the date boxes. If you mouse-over the flex buttons, they jump to the right size, but there is still rendering errors.
The modifications I made had no effect, because the servers give the same results on both my version and the demo version hosted online. As far as I can tell, the servers are identical (IE version, Flash version, etc.)
How can I get it to display normally?
Initial View
After Mouseover
Usual Demo
Demo in bad server
Edit: On the server that renders it improperly, Firefox renders it fine, but Firefox cannot be used for other (unchangeable) reasons.
From the images it appears this is how the SWF appears in the Browser of each server - one good and one bad. Not how the SWF appears in any browser while being hosted from each server.
Sense it is the browser display that is not working correctly I would assume it is a rendering problem with the browser and not the server.
1.) The problem could come from JavaScript being disabled in one of the browsers and the view being taken from the embed tag. Check to ensure that it looks the same with JavaScript both on and off.
2.) The height being 100% could also be messing it up in the browser. Try setting the height to a specific value (800px) and see if that corrects the problem.
3.) Make sure that the browsers are the same. Is one IE 7 and one IE 8? If they are the same, check the version number to ensure that all updates are the same for each.
4.) View the site from another computer that is connected to the server.
Number 1 and 2 would be my best guess as a way to troubleshoot.