The Microsoft Edge team is continuing to work hard on making the new web browser work as well as possible with modern day websites. A perfect example of a website Microsoft is making compatible with Edge is a popular publishing website called Medium. Many users had reported that Internet Explorer 11 didn’t worked with Medium’s online editor. While the Microsoft Edge team was looking into this issue, they found an article from the Medium engineering team explaining the issue.
Our QA team noticed a weird bug when editing a story in Internet Explorer. A thick, grey rectangle would appear around our editor and cut straight through our UI. (If you look at the story I’m responding to, you can see the rectangle in their screenshot as well.) Once we confirmed the bug, we rolled back my change that made IE11 a Tier 1 browser and went to find a way to fix that issue. Unfortunately, it seems like the only way to remove the resizable border is to make our content-editable area non-editable. This, obviously, doesn’t work for us.
This has lead Microsoft to seek Medium for help on this issue that prevented Internet Explorer form having full access to Medium’s publishing platform. Microsoft worked with Medium to try to better understand what the problem was.
The problem was that Medium’s editor interface was using the nonstandard legacy feature of IE 6 that involved object selection. This was originally for HTML-based form editors such as PowerPoint back when Internet Explorer was only at version 6. Below is an image that shows how this old form editor worked.
Microsoft explains the problem:
There was a floating div element inside a contentEditable region which we allowed to be object-selectable and resizable, resulting in gripper UI over the editable section. We had similar feedback bugs reported to us in the past, but due to the complexity of removing this behavior and the risks of a long bug trail, IE 11 ultimately shipped with the functionality.
Microsoft says that they are moving to a set of new interoperable APIs that let developers advance with web-based editors without having to use old legacy features. Over 1500 lines of C++ code will be removed from the browser’s engine. This gives us improved interoperability with modern web browsers and reduced complexity with editing features.
