Great Bug Reports via “Recreate My Problem” in Microsoft Edge

When you encounter a problem in Microsoft Edge, you can let the team know about it using the … Menu > Help and Feedback > Send Feedback command.

Clicking this menu item will open Edge’s feedback wizard, which provides tons of options about what information will be submitted along with your bug report. Generally speaking, the more data you provide, the more likely it is that we will be able to resolve the problem you encountered.

  • A good description of the problem (What happened? What did you expect?) is the basis of a good feedback report.
  • If you omit or alter the URL of the page with a problem, it can make it almost impossible for us to do anything about it.
  • If you omit your email address, we won’t be able to contact you to share a workaround or ask for more information.
  • Diagnostic data is often very useful for helping to understand what browser configuration choices (installed extensions, configured permissions, Enterprise policies, etc) might be impacting your scenario.
  • A picture is worth a thousand words, so a screenshot is super-useful for helping us understand what you’re seeing.

The most complete and useful feedback report is one with a Recreate my problem trace attached to it. This trace allows you to reproduce the problem while recording a video of your tab (or screen) and a network trace.

To add the repro trace, click the Recreate my problem button at the bottom of the feedback screen:

…or click the diagnostic data link and click the Recreate my problem tab.

Tick the checkbox to indicate that you understand that the capture is likely to contain personal data (which will be transmitted and stored securely by Microsoft), and then click the Start recording button:

A prompt will appear to allow you to select which portion of the screen to record. You can either choose to record the whole screen, the Edge window (use this one to report problems in the browser’s menus/toolbars/etc) or just the tab exhibiting a problem:

Then, go back to the tab and reproduce the problem you encountered. After doing so, return to the feedback window and choose Stop Recording and Save and Include.

If you later change your mind and want to remove the video or network traffic log before submitting your feedback report, you can do so using the Remove links shown on the Recreate my problem screen.

Finally, click the Send button on your feedback report. Your report will be securely uploaded to Microsoft over HTTPS and will be placed in our secure bug-reporting database. Triage teams will soon examine your report, attempting to reproduce and root cause the problem so that we can fix it for you and everyone else in an update to Microsoft Edge.

Thanks for your help!



Chromium offers two ways for an end-user to view the source code of a web page: 1) the Developer Tools, and 2) The longstanding view-source viewer. Of these, the Developer Tools have received almost all of the attention over the last decade, but in this post I want to take a quick look at the older view-source feature.

To get to the View Page Source feature, you can use the the Ctrl+U keyboard shortcut, the View page source context menu item, or add view-source: prefix before a URL in the omnibox. No matter what mechanism you use, you’ll get a new tab containing a simple view of the original source code of the page, not the current document’s DOM (which may have been extensively modified by script or the user).


Over the years, I’ve landed a few fixes to the View-Source code, including security fixes and user-experience fixes (e.g. support for rendering Dark Mode). The feature doesn’t get a lot of love, but its implementation is interesting. Why?

First, let’s start with the URL. Chromium uses a BrowserURLHandler to rewrite all URLs with a view-source: prefix by stripping off the prefix; a VirtualUrl is set on the navigation entry so the user continues to see the view-source prefix in the omnibox, even as the renderer uses the inner url as the source location:

If the user tries to use view-source against an unsupported scheme like javascript:, the rewriter changes the inner url to about:blank.

If the user invokes View page source on a given document, the WebContents’ ViewSource() function takes the current document’s URL, slaps a view-source: prefix on the front, massages a few things, and opens the resulting URL in a new tab.

Most interestingly, View Source is implemented as a mode for a Document loaded inside Blink– you simply call SetIsViewSource(true) on the Document, and then the ComputeDocumentType sets things up such that the CreateDocument() function creates a HTMLViewSourceDocument instead of a plain HTMLDocument. The ViewSource document uses a simpler parser and it does not do much beyond adding markup to display basic color highlighting on HTML elements and their attributes. The resulting “source-formatted” HTML is displayed as text to the user.


Generally, products try not to expose multiple features to achieve the same task, especially when they use different code to do it. For a while, the View-Source viewer had some unique features that justified its existence; e.g. it integrated with the XSS Auditor to mark blocks of code that the Auditor had deemed reflected XSS attacks:

However, the XSS Auditor was removed more than two years ago. Similarly, many years ago, a site could link directly to a view-source URL (e.g. a HTML tutorial website might do this), but that capability was removed in 2016 for security reasons.

Nowadays, the viewer offers a subset of the features of the Developer Tools’ Sources tab. The Sources tab offers several cool features, including Pretty Print, red-underlines for script errors, and the ability to switch between all of the sources used by the currently loaded page:

The Elements tab is different than both the Sources tab and the view-source viewer because it reflects the current state of the DOM of the currently-loaded page– modifications made to the page by JavaScript are shown in the Elements tab.

At this point, you might naturally wonder why the old viewer still exists.

Part of the answer is “Well, it’s been there forever, and doesn’t cost too much to maintain.” It’s been proposed that perhaps the CTRL+U shortcut should just open the Developer Tools’ Sources tab. However, there are some non-obvious reasons that the old viewer continues to live on:

  1. For Chromium on Android1, adding the view-source prefix in the omnibox is the only convenient way to view source without first tethering your device to a DevTools instance running on a desktop PC.
  2. The HTMLViewSourceDocument code that makes up the bulk of the feature cannot be deleted because the default XML rendering view depends upon it.

    If the user navigates to an XML file that lacks an XSLT, the XML parser calls GetDocument()->SetIsViewSource(true); which results in the browser rendering the plain XML as a document tree:

May the Source be with you!


1 Unfortunately, Chromium on iOS doesn’t support either view-source or the Developer Tools. If the iOS browser syncs a view-source url from another platform, the prefix is simply stripped off.

Spooky: Enhancing Dark Mode in Chromium

I am not really a fan of Dark Mode — I like my screens bright and shiny. But it’s October, and it’s sometimes fun to make things dark and spooky.

Some users of my Show Browser Version extension wanted it to better support Dark Mode– the default text colors didn’t work well when the browser frame was black. I landed a simple change to select bright text colors when the browser is in Dark Mode and called it done.

However, after testing my updates, I lazily left my Dev Channel browser in Dark Mode. Over the following months, I noticed that a surprising number of Chromium’s built-in pages were still rendering in brilliant white. Encountering a bright white screen after surfing around in dark mode can be jarring, to say the least.

I wondered how hard it would be to fix some of these pages. The answer, it turns out, is “it’s mostly trivial.”

To indicate that a page supports dark mode styling, simply add a color-scheme meta tag to the head section of the HTML:

<meta name="color-scheme" content="light dark">

Alternatively, add the following rule to the CSS:

:root {
  color-scheme: light dark;

Either change alone is enough for simple pages to render nicely in Dark Mode.

However, many pages use more colors than just the default text and background color, so new colors to be used in Dark Mode must be selected. To adjust colors based on the dark mode preference, use the prefers-color-scheme media query to override the default color in your stylesheet. For example:

#tab-list a:hover {
  color: white;

@media (prefers-color-scheme: dark) {
  #tab-list a:hover {
    color: black;

Tip: Use CSS Variables for Dynamic Updates

When I first updated the about:Net-Internals page, I added dark mode detection and colors to a JavaScript function used to temporarily highlight a div:

function highlightFade(element) {
  const isDarkMode = 
      window.matchMedia('(prefers-color-scheme: dark)').matches; = 'background-color'; = '0s'; = 
               isDarkMode ? '#03DCB0' : '#fffccf';
  setTimeout(function() { = '1s'; = 
               isDarkMode ? '#121212' : '#fff';
  }, 0);

However, I noticed a downside to this approach– if I changed my OS color theme from Light to Dark after this function had run without reloading the page, the old white (#fff) background color lingered on the div— it didn’t update to dark like the rest of the background of the page.

The fix was to specify the light and dark colors using CSS Variables within the stylesheet:

 :root {
  --color-active-tab: black;
  --color-background: #fff;
  --color-highlight: #fffccf;

@media (prefers-color-scheme: dark) {
  :root {
    --color-active-tab: white;
    --color-background: #121212;
    --color-highlight:  #03DCB0;

…and update the JavaScript function to reference them:

function highlightFade(element) { = 'background-color'; = '0s'; = "var(--color-highlight)";
  setTimeout(function() { = '1s'; = "var(--color-background)";
  }, 0);

Now, as the OS switches between light/dark, the CSS variable is recalculated and the colors in the page are updated automatically.

Tip: UA Stylesheets are Special

Updating Chromium’s View-Source to support Dark Mode was a bit trickier, because the styles used in View-Source rendering come from a User-Agent stylesheet. Unlike a regular stylesheet, UA Stylesheets’ support for Media Queries is very limited, and prefers-color-scheme is not allowed.

The solution turns out to be pretty simple: instead of using a media query, we express colors using a special (only usable in UA Stylesheets) function, LightDarkValuePair that returns one of its two color arguments based on whether light or dark theme is in use:

color: -internal-light-dark(#00e, rgb(159, 180, 214));

This allows the View-Source page to respect dark mode without needing a media query.

View-Source also uses a bunch of different text colors for syntax-highlighting, so I had to override those– to avoid picking my own colors, I borrowed the colors from the dark mode support in the Developer Tools.

Changelists and Bugs

There’s still more to do (e.g. text, json) but here’s a list of updates I’ve made so far:

Some of these changes are so simple you can even make them using Chromium’s web-based editor!


MoarTLS: Non-Secure Download Blocking

With little fanfare, an important security change has arrived on the web. Now, all major browsers (except Safari) block non-secure downloads from a secure page.

Browser VersionBehavior
Edge 94+Block with right-click “Keep” button
Chrome 94Block Silently
Firefox 93Block with “Allow download” button
Brave 1.30.89Block Silently
Opera 79.0.4143.72Block Silently
Safari 15Allow
Vivaldi 4.3.2439.44Allow
Major Browser Behavior

You can test your browser’s behavior with this test page. In Edge 94, the block looks like this:

By right-clicking on the “can’t be downloaded securely” item, you can choose to continue the download anyway.

Firefox offers a very similar user-experience, although somewhat confusingly, they prompt for permission to save the file before blocking it:

Firefox 93 Blocking UX

The Chromium team started rolling out this protection last year. Over time, the Chrome block turned into a silent block (arguably confusing for users) where the only indication of an attempted/blocked download is a notice in the Developer Tools console:

End-User Override

Within Chrome or Edge, a user may use the Permissions UI to enable a secure site to download non-secure resources without blocking.

IT Administrator Override

The InsecureContentAllowedForUrls policy allows an IT administrator to exempt sites from mixed content blocking. List the origins that are allowed to request non-secure content/downloads (list the source page’s origin, not the target resource’s origin):

InsecureContentallowedForUrls Policy

My MoarTLS browser extension makes it simple for you to see whether any of the links (including download links) on your page are non-secure:

… however, note that this tool only flags links that are directly non-secure– if the link goes to HTTPS but then subsequently redirects to (or through) HTTP, the tool won’t notice, but the browser blocker will.

The fact that the browser blocks the download if any URL used in a download’s source redirect chain is non-secure can lead to confusing UI whenever only a single URL is shown to the user. For instance, this download was blocked because the source page referred to HTTP but the request was subsequently redirected to the HTTPS URL shown:

The first step in avoiding mixed content download blocking is to ensure that all of your resources are available over HTTPS; if a download isn’t available over HTTPS, updating the source page’s download link’s url to point to https isn’t going to work.

The second step to avoiding blocking is to change all of the download links from HTTP to HTTPS.

Unfortunately, this might be much easier said than done– you might have hundreds of pages with hundreds of links.

What to do?

One approach is to use automation to rewrite links, either as a one-time job, or as a dynamic rewrite. When I was first building my test page above, I couldn’t figure out why it wasn’t working. It took a good 15 minutes to realize that I’d configured Cloudflare to automatically rewrite HTTP links to HTTPS. (In the Cloudflare Control panel, select SSL/TLS > Edge Certificates and enable Automatic HTTPS Rewrites.)

Content-Security-Policy offers an Upgrade-Insecure-Requests (UIR) directive that upgrades all of a page’s embedded resource URLs from HTTP to HTTPS. This is a great approach for fixing mixed content bugs without doing a lot of work on every page. Unfortunately, file downloads are typically treated as “Navigation requests”, which means that a UIR rule on will upgrade but UIR will not upgrade because it is not same-origin to the original page. Bummer.

You might hope that just putting your download site on the Strict-Transport-Security (HSTS) pre-load list might fix things because doing so ensures that your site is always contacted over HTTPS. Unfortunately, for historical reasons, HSTS is evaluated after mixed content blocking and so this approach does not work. But the Chromium team is considering whether blocking should be bypassed if non-secure requests in the download flow were upgraded to HTTPS via HSTS or the browser’s “Always use HTTPS” setting such that every URL that actually hit the network was secure.

Browser Bugs

Today, if you try to close the browser without explicitly aborting the blocked download, Edge complains at you. I’ve filed feedback that we should just cancel.

HTTPS for all the things!


Accessibility (UIA) Troubleshooting

Chromium-based browsers offer a number of accessibility-related features. When you visit about:accessibility, you can see more about the state of these features (similarly, you can find the states in about:histograms/Accessibility.ModeFlag). You can enable features via the Accessibility page, or pass the command line argument --force-renderer-accessibility into the browser.

In some cases, you may be surprised to find some of the accessibility features enabled even when you have not manually enabled them:

This can happen when the browser detects interactions from a UI Automation tool; such API calls are mostly from accessibility tools like screen-readers. However, some features like Windows 10’s Text Cursor Indicator:

…are implemented using UIA, and when this feature is enabled, the browser enables the corresponding accessibility features.

Back in the spring, some improvements to the Accessibility code caused a series of regressions that would result in crashes, hangs, and memory exhaustion when a loading many pages, including YouTube:

These regressions were impactful for many customers who didn’t expect to be running the impacted code. Fortunately, the problems were quickly fixed.

Update: A similar regression shipped in Edge 97.1069 and should be fixed in Edge 97.1073; in the case of the new crash, the entire browser crashes and disappears. :(

Unfortunately for end-users, tracking down how Accessibility features got enabled on their browsers is presently used to be non-trivial. (Update: read on)

For Microsoft Edge users running Windows 10 version 20H1 or later, visiting about:histograms/UIA will show a truncated hash of the process name of the UIA client:

The value shown is the Integer representation of the first four bytes of the SHA-1 Hash of the process name. Some common values include:

Truncated HashProcess Name
612857738EoAExperiences.exe (Win10 Text Cursor Indicator feature)

Unfortunately, there’s no easy way to go from a truncated hash back to the original string; hashes are one-way. (The only way to do it is brute force — start with a list of possible strings and hash them all to find a match).

A simple PowerShell script mostly written by Artem Pronichkin allows you to get the hashes of all of your running processes, which you can then compare to the reported value:

In the future, we hope to streamline this experience somewhat, but for now, it’s an annoyingly geeky scavenger hunt.

Update: In Edge 93+, the edge://accessibility page includes a simple “Show Client Info” button. Easy peasy.

In this case, we see the Text Cursor Indicator feature implemented inside EoAExperiences.exe has enabled accessibility for Edge.

Practical Time Machines

Many “emergency” situations in our modern world would’ve been easy to fix had they been foreseen in advance. If only we’d known what was going to happen, the badness could’ve easily been prevented.

Unfortunately, when problems are discovered only “as they happen” in production, everyone must race to minimize the damage and put out the fires, dramatically increasing the cost and fallout of otherwise-trivial problems.

Turn your Emergencies into WorkItems

Background: You Are A Time Traveler

Yes, you, dear reader. You travel through time. A second has passed since you started reading this paragraph. You are never getting that second back (sorry!).

For all of its complexities, time (or at least our perception of it) is the most reliable thing in the universe. With every passing second, the universe ticks forward in time.

So, now we’ve established that time travel is not only possible, but guaranteed. Unfortunately, this sort of time travel isn’t very useful for our purposes. It’s not useful because everyone around us is also traveling through time at the same rate. If we’re doing a great job of paying attention, perhaps we’ll notice a problem before everyone else and maybe we’ll be able to fix it before anyone else notices, but this is still the definition of an emergency– we’re in a race against the clock. It’s exhausting, and we’ll usually lose.

If we had a way to send messages back to our past, perhaps disasters could be averted or great fortunes could be won. Alas, time is an arrow, and that arrow only points to the future. Unfortunately, changing the past is out.

So, we’ll need to change the present based on what happens in the future.

If only we had some sort of magical time machine to let us see what was going to go wrong before it actually does. Seems like an overused trope for TV shows and so many of my favorite movies, right?

What would you say if I told you that you’re surrounded by working time machines, you just have to use them?

The Future is Different

Before I tell you how to use or build time machines that let you glimpse the future, let’s restate our goal– we want to prevent future emergencies by discovering and fixing them in advance.

A key reason we’re so often surprised by emergency problems is that we expect the tools we use successfully today to continue to work tomorrow. This is a fundamental mistake.

It’s probably not true that Einstein said “The definition of insanity is doing the same thing over and over again, but expecting different results,” but it’s absolutely true that I have saidThe definition of insanity is doing the same thing over and over again, and expecting the same results.

That’s because we can’t ever truly “do the same thing” over and over again: before we were doing it then, but when we do it again, we’re doing it now. We’re in a changed universe.

The only constant is change, and the present is simply different than than the past; similarly, the future will be different than the present in innumerable ways. Many of those differences will be unpredictable, but fortunately some are predictable at high confidence.

For example, our software and services in the future will:

  1. Always be executed at a later date and time
  2. Probably bear a higher version number
  3. Probably contain many new features and bugfixes

Given this knowledge, many of our software emergencies are entirely predictable:

  • Certificates, access tokens, cookies, caches, and time bombs will expire
  • Version parsers will get confused by or reject unexpectedly large numbers
  • Workarounds, hacks, and quirks will stop working

Computers have a rather primitive understanding of the real Universe; they largely believe whatever inputs we give them. By controlling the inputs, we control their Universe.

Practical Time Machine – The Clock

Your computer can travel to the future even more easily than a DeLorean. The UI isn’t quite as cool, but it doesn’t require plutonium. Simply open your system control panel, turn off the “Set time automatically” option, and click the button to adjust the system date/time to your target.

Almost immediately, all hell will break loose. Microsoft Teams and most other applications will go “offline.”

Webpages will stop loading:

Signed programs might start getting reported as “Unknown publisher”:

…and on and on.

Now, as a time machine, this one’s a bit buggy. It shows what is likely to happen in the future if nothing else changes. But some things will change. Most web servers are now using the ACME protocol to automatically renew certificates shortly in advance of their expiration, so setting your clock five years into the future is likely to turn up a lot of false positives. However, setting your clock five days into the future is probably reasonable – you’ll get enough advance warning to figure out why a certificate is expiring, what the implications are, and deploy a new certificate.

Automated renewal doesn’t solve all problems for certificates though– for instance, it doesn’t fix up certificates embedded in client software, and it typically only applies to the end-entity certificate, not intermediates. Back in 2019, Mozilla accidentally let a certificate expire, breaking all extensions. This week, an intermediate certificate used by LetsEncrypt expired, leading to a trail of broken apps, sites, and devices.

In the final screenshot above, Windows shows the “Unknown publisher” warning because the software’s signature lacks a timestamp.

Without an Authenticode timestamp, when the signer’s certificate expires, all of the signatures from that certificate are deemed invalid. Good luck replacing every binary on every user’s system.

Beyond certificates expiring, you’re likely to notice other issues as well– trial software will expire, Strict-Transport-Security preloads will stop working, etc. For each of these issues, you will need to investigate and decide to take action.

Note: Depending on what you’re trying to do, you might not need to change the entire system clock; you might be able to change the clock for just one app.

Practical Time Machine – Version Lies

One of the most common predictable emergencies is when a scenario begins to fail because a software’s version number gets “too high.”

This happened so commonly in Windows client software that Microsoft changed the GetVersionEx function to start lying to applications unless they declare (via manifest) that they can handle the truth. Similarly, Windows 11 will advertise itself as version 10.0 to websites.

The Chromium team, anticipating that Chrome’s upcoming release of 100 is likely to break websites, built-in a simple flag to allow folks to test with the new 100 version number in the browser’s User-Agent string. Here’s an example of a problem (actually two) found when using the new “Force Version 100” flag:

As you can see, the website incorrectly parses the User-Agent string and concludes that Chrome is outdated, pushing the user to install another browser using icons circa 2009. And closer to home, my Show Chrome Version extension truncates the string 100 to 10 when rendering the information in the toolbar button. Oops.

Even if your browser vendor doesn’t offer a simple “Fake the future” flag, you can typically override the User-Agent string via a command-line argument (--user-agent), DevTools Command (Network Conditions), extension, or simple FiddlerScript rule.

Practical Time Machine – Channels

Most state-of-the-art software these days is available in multiple channels— a current version (commonly called “Release” or “Stable”) and future versions (often called “Pre-Release”, “Beta”, “Alpha”, “Dev”, “Canary”, “Preview”, or “Nightly”).

All major web browsers, in particular, follow this paradigm.

Using Pre-Release versions of browsers is, by far, the best way to learn what changes are coming in the future that might break your sites and services. There’s no higher-fidelity way (short of that plutonium-powered DeLorean) to find out what bugfixes, new features, and regressions (gulp) are headed for your user-base than to simply try the code that everyone will be running in a few weeks or months.

This option is convenient, low-friction, and is highly recommended for developers, IT, and a small “ring” of every Enterprise’s everyday users.

I cannot count how many times we (Chromium or Microsoft) got feedback from a Beta/Dev/Canary user of the browser that we used to fix a problem before it broke anyone in the Stable channel. Examples? This break in M96 was fixed a week before Stable. Another? Two days before Chrome 88 branched for Stable release, an Enterprise reported that their app was broken in Beta. We quickly investigated and isolated the regression in handling of XSLTs. We fixed it within a day. Unfortunately, a different department in the same Enterprise did not deploy a Beta ring, and a regression in their workflow wasn’t discovered until 88 Stable released, impacting everyone in the department.

Q: How do I “switch channels” for the new Microsoft Edge browser?
A: In addition to Stable, there are 3  channels: Beta, Dev, and Canary, and you can install them all on the same device at the same time, and choose which you want to run at any time. They are all kept up to date automatically. Any of them can be set as your default browser. Also, if you enable sync, then your data will sync between installed channels on the same device (provided you log in to each with the same ID). To get all the channels, go to

What about Extended Stable?

Google Chrome and Microsoft Edge recently introduced support for an Extended Stable version, which is a bit like a time-machine that keeps your users “stuck in the past”, allowing them to run an (even numbered) “Extended Stable” release for up to four weeks beyond the release date of the subsequent (odd numbered) “Stable” channel. This is an interesting variant of the time machine approach– you’re hoping that the extra four weeks will allow any problems in the “Stable” release to be found and fixed before upgrading to the next release. But it’s not a panacea. Say you’ve got your users on Edge 94 Extended Stable. They skip Edge 95 entirely, and four weeks later are upgraded to Edge 96 Extended Stable. While any problems in Edge 95 may have been mitigated before your users update to Edge 96, only problems found in the pre-release channels of Edge 96 will get fixed before everyone moves up to 96.

Read Dispatches from the Future

Beyond running pre-release channels yourself, you can also take advantage of published documentation about what changes are coming in the future. Ranging from Edge’s Site Impacting Changes list to our Roadmap to the Chrome Platform Status page, you can see lists of top changes that are heading to Stable in the future. While documentation is useful, I still strongly recommend running Beta/Dev channels in your environment– our documentation covers the top changes we made on purpose— it doesn’t cover accidental bugs or the thousands of other changes made to each release that we didn’t expect to break anyone.

Some Enterprises have asked “Can’t you just give us the full changelist for each release?!?” and I’ve been put in the unfortunate and dangerous position of saying “I know enough about you and your business to know what you’re asking for isn’t what you really want.”

The list changes in each new Stable release would run to hundreds of pages. A change like “Enable TableNG“, which completely replaced the table-layout engine, would be both extremely difficult to describe, and you as an IT Manager would be poorly equipped to understand whether it would impact your sites — the only practical approach is to test your sites and apps in a pre-release change.

I promise.

There are other ways to discover what will happen in the future. Run your browser with the F12 Developer Tools open and watch the Console and Issues tabs for upcoming changes and deprecation notices:

Before deploying new features like Content-Security-Policy on your website, use the report_only mode to collect issue reports from real-world users, before enabling enforcement of those policies.

In many cases, sites quietly broadcast when something will break– for instance, a server’s certificate contains its expiration date. You can write rules in FiddlerScript to warn you on every HTTPS response whose certificate is soon to expire.

Calls To Action

  • If you’re responsible for using or deploying software, use the time machines at your disposal.
  • If you’re responsible for designing or building software, build new time machines for everyone to use.
  • If you’ve read this far, use the comments section below to remind me of real-world time machines I’ve forgotten to mention.

You’re a time traveler. Act like one!


Determining OS Platform Version

In general, you should not care what Operating System visitors are using to visit your website. If you attempt to be clever, you will often get it wrong and cause problems that are an annoyance for users and a hassle for me to debug.

So avoid trying to be nosy/clever if at all possible.

That being said, some websites want to be able to distinguish Windows versions for whatever reason; I’m an engineer, not a cop.

The typical path to get this information from Windows-based browsers is to look at the dreaded User-Agent string, a wretched hive of lies, scum, and villainy.

However, this approach falls down with Windows 11, which reports itself as Windows NT 10.0 (almost certainly for compatibility reasons); in general, browsers are moving toward freezing and reducing the User-Agent string to limit passive fingerprinting. The modern mechanism for learning more information about the client is called Client Hints.

If you want to be able to distinguish between Windows 10 and Windows 11, starting around October 2021 in Microsoft Edge 95 (and v95 of most Chromium browsers), the Sec-Ch-UA-Platform-Version Client Hint is the way to go.

Available for request in v95+, this value will indicate the UniversalApiContract “API Level” of the Windows platform. The mapping of values to Windows version is:

Windows VersionSec-CH-UA-Platform-Version
Windows 7 | 8 |
Windows 10 15071.0.0
Windows 10 15112.0.0
Windows 10 16073.0.0
Windows 10 17034.0.0
Windows 10 17095.0.0
Windows 10 18036.0.0
Windows 10 18097.0.0
Windows 10 1903 | 19098.0.0
Windows 10 2004 | 20H2 | 21H110.0.0
Windows 11 Previews13.0.0 | 14.0.0
Windows 11 Release15.0.0

You can request this Client Hint from JavaScript thusly:

.then(uapv => { console.log(uapv.platformVersion); });

Note that the userAgentData API requires that your page be a secure context (Served by ~https or on localhost).

Or you can request it be sent to your server as a HTTP request header on subsequent requests by sending a response header:

Response.AddHeader("Accept-CH", "Sec-CH-UA-Platform-Version");
Response.AddHeader("Accept-CH-Lifetime", "86400");

As you may have noticed, the 0.0.0 value is shared across all pre-Windows 10 versions of Windows, so you’ll need to continue to use the User-Agent to distinguish between Windows 7, 8.0, and 8.1 platforms (starting in v107, you will need Client Hints, because the UA string will lie and claim 10.0 even on earlier Windows).

As far as I know, Firefox does not plan to implement this Client Hint.

Bonus: Platform Architecture and Bitness

Distributors of native applications often would like to know the bitness and architecture of the client platform to ensure that they serve the correct installer for their native application. The sec-ch-ua-bitness and sec-ch-ua-arch hints are useful for this purpose.

Unfortunately, there’s presently a bug in Chromium whereby ARM64 devices like the Surface Pro X will return x86 as the architecture. UPDATE: Fixed in v98.

The Edge-proprietary window.external.getHostEnvironmentValue() API returns the truth {"os-architecture":"ARM64"}, but this API is non-standard and you should not use it.


PS: Native client apps should generally not check the registry key directly, instead it should query the appropriate “Is this API level supported?? API. HKLM\SOFTWARE\Microsoft\WindowsRuntime\WellKnownContracts\Windows.Foundation.UniversalApiContract

Leaky Abstractions

In the late 1990s, the Windows Shell and Internet Explorer teams introduced a bunch of brilliant and intricate designs that allowed extension of the shell and the browser to handle scenarios beyond what those built by Microsoft itself. For instance, Internet Explorer supported the notion of pluggable protocols (“What if some protocol, say, FTPS, becomes as important as HTTP?”) and the Windows Shell offered an extremely flexible set of abstractions for browsing of namespaces, enabling third parties to build browsable “folders” not backed by the file system– everything from WebDAV (“your HTTP-server is a folder“) to CAB Folders (“your CAB archive is a folder“). As a PM on the clipart team in 2004, after I built a .NET-based application to browse clipart from the Office web services, I next sketched out an initial design for a Windows Shell extension that would make it look like Microsoft’s enormous web-based clipart archive were installed in a local folder on your system.

Perhaps the most popular (or infamous) example of a shell namespace extension is the Compressed Folders extension, which handles the exploration of ZIP files. First introduced in the Windows 98 Plus Pack and later included with Windows Me+ directly, Compressed Folders allows billions of Windows users to interact with ZIP files without downloading third-party software. Perhaps surprisingly, the feature was itself was acquired from two third-parties — Microsoft acquired the Explorer integration from Dave Plummer’s “side project”, while a company called InnerMedia claims credit for the “DynaZIP” engine underneath.

Unfortunately, the code hasn’t really been updated in a while. A long while. The timestamp in the module claims it was last updated on Valentine’s Day 1998, and while I suspect there may’ve been a fix here or there since then (and one feature, extract-only Unicode filename support), it’s no secret that the code is, as Raymond Chen says: “stuck at the turn of the century.” That means that it doesn’t support “modern” features like AES encryption, and its performance (runtime, compression ratio) is known to be dramatically inferior to modern 3rd-party implementations.

So, why hasn’t it been updated? Well, “if it aint broke, don’t fix it” accounts for part of the thinking– the ZIP Folders implementation has survived in Windows for 23 years without the howling of customers becoming unbearable, so there’s some evidence that users are happy enough.

Unfortunately, there are degenerate cases where the ZIP Folders support really is broken. I ran across one of those yesterday. I had seen an interesting Twitter thread about hex editors that offer annotation (useful for exploring file formats) and decided to try a few out (I decided I like ReHex best). But in the process, I downloaded the portable version of ImHex and tried to move it to my Tools folder.

I did so by double-clicking the 11.5mb ZIP to open it. I then hit CTRL+A to select all of the files within, then crucially (spoiler alert) CTRL+X to cut the files to my clipboard.

I then created a new subfolder in my C:\Tools folder and hit CTRL+V to paste. And here’s where everything went off the rails– Windows spent well over a minute showing “Calculating…” with no visible progress beyond the creation of a single subfolder with a single 5k file within:

Huh? I knew that the ZIP engine beneath ZIP Folders wasn’t well-optimized, but I’d never seen anything this bad before. After waiting a few more minutes, another file extracted, this one 6.5 mb:

This is bananas. I opened Task Manager, but nothing seemed to be using up much of my 12 thread CPU, my 64gb of memory, or my NVMe SSD. Finally, I opened up SysInternals’ Process Monitor to try to see what was going on, and the root cause of the problem was quickly seen.

After some small reads from the end of the file (where the ZIP file keeps its index), the entire 11 million byte file was being read from disk a single byte at a time:

Looking more closely, I realized that the reads were almost all a single byte, but every now and then, after a specific 1 byte read, a 15 byte read was issued:

What’s at those interesting offsets (330, 337)? The byte 0x50, aka the letter P.

Having written some trivial ZIP-recovery code in the past, I know what’s special about the character P in ZIP files– it’s the first byte of the ZIP format’s block markers, each of which start with 0x50 0x4B. So what’s plainly happening here is that the code is reading the file from start to finish looking for a particular block, 16 bytes in size. Each time it hits a P, it looks at the next 15 bytes to see if they match the desired signature, and if not, it continues scanning byte-by-byte, looking for the next P.

Is there something special about this particular ZIP file? Yes.

The ZIP Format consists of a series of file records, followed by a list (“Central Directory”) of those file records.

Each file record has its own “local file header” which contains information about the file, including its size, compressed size, and CRC-32; the same metadata is repeated in the Central Directory.

However, the ZIP format allows the local file headers to omit this metadata and instead write it as a “trailer” after each individual file’s DEFLATE-compressed data, a capability that is useful when streaming compression– you cannot know the final compressed size for each file until you’ve actually finished compressing its data. Most ZIP files probably don’t make use of this option, but my example download does. (The developer reports that this ZIP file was created by the GitHub CI.)

You can see the CRC and sizes are 0‘d in the header and instead appear immediately following the signature 0x08074b50 (Data Descriptor), just before the next file’s local header:

The 0x08 bit in the General Purpose flag indicates this option; users of 7-Zip can find it mentioned as Descriptor in the entry’s Characteristics column:

Based on the read size (1+15 bytes), I assume the code is groveling for the Data Descriptor blocks. Why it does that (vs. just reading the same data from the Central Directory), I do not know.

Making matters worse, this “read the file, byte by byte” crawl through the file doesn’t just happen once– it happens at least once for every file extracted. Making matters worse, this data is being read with ReadFile rather than fread() meaning that there’s no caching in userspace, requiring we go to the kernel for every byte read.

Eventually, after watching about 85 million single byte reads, Process Monitor hangs:

After restarting and configuring Process Monitor with Symbols, we can examine the one-byte reads and get a hint of what’s going on:

The GetSomeBytes function is getting hammered with calls passing a single byte buffer, in a tight loop inside the readzipfile function. But look down the stack and the root cause of the mess becomes clear– this is happening because after each file is “moved” from the ZIP to the target folder, the ZIP file must be updated to remove the file that was “moved.” This deletion process is inherently not fast (because it results in shuffling all of the subsequent bytes of the file and updating the index), and as implemented in the readzipfile function (with its one-byte read buffer) it is atrociously slow.

Back up in my repro steps, note that I hit CTRL+X to “Cut” the files, resulting in a Move operation. Had I instead hit CTRL+C to “Copy” the files, resulting in a Copy operation, the ZIP folder would not have performed a delete operation as each file was extracted. The time required to unpack the ZIP file drops from over thirty minutes to four seconds. For perspective, 7-Zip unpacks the file in under a quarter of a second, although it cheats a little.

And here’s where the abstraction leaks— from a user’s point-of-view, copying files out of a ZIP file (then deleting the ZIP) vs. moving the files from a ZIP file seems like it shouldn’t be very different. Unfortunately, the abstraction fails to fully paper over the reality that deleting from certain ZIP files is an extremely slow operation, while deleting a file from a disk is usually trivial. As a consequence, the Compressed Folder abstraction works well for tiny ZIPs, but fails for the larger ZIP files that are becoming increasingly common.

While it’s relatively easy to think of ways to dramatically improve the performance of this scenario, precedent suggests that the code in Windows is unlikely to be improved anytime soon. Perhaps for its 25th Anniversary? 🤞

– Eric

Offline NetLog Viewing

A while back, I explained how you can use Telerik Fiddler or the Catapult NetLog Viewer to analyze a network log captured from Microsoft Edge, Google Chrome, or another Chromium or Electron-based application.

While Fiddler is a native app that runs locally, the Catapult NetLog Viewer is a JavaScript application that runs in your browser. Because NetLogs can contain sensitive data, some users have worried about the privacy of the viewer– what if someday it started leaking sensitive data from logs, either unintentionally or maliciously?

Fortunately, the NetLog Viewer is a self-contained single page application that doesn’t need a network connection to run. You can use it entirely offline, either from a Virtual Machine with no network connection, or from a browser instance configured to override all network requests.

Your first step is to get an copy of the viewer as a file. You can do that by right-clicking this link and choosing “Save Link As”. Save the HTML file somewhere locally, e.g. C:\temp\NetLogView.html on Windows.

If you want to run it from a disconnected VM, simply copy the file into such a VM and you’re good to go.

If, however, you want the convenience of running the viewer from your Internet-connected PC without worrying about leaks, you can run it from a browser instance that won’t make network connections.

After saving the file, open it in a new browser window thusly:

msedge.exe --user-data-dir=C:\temp\profile --inprivate --host-rules="MAP *" --app=C:\temp\NetLogView.html

The command line arguments bear some explanation. In reverse order:

  • The app argument instructs Edge to open the supplied file with a minimal browser UI, as if it were a native app.
  • The host-rules argument tells the browser instance to direct all network requests to an IP address of On Windows, such requests instantly fail. On Mac/Linux, the null IP points back at your own PC.
  • The inprivate argument directs the browser to discard all storage after the app exits (since it’s not needed). For Chrome, use --incognito instead.
  • The user-data-dir instructs the browser to use a temporary browser profile (which prevents the app’s window from being merged into an existing browser process, such that the host-rules argument would’ve been ignored.)

While none of this is strictly necessary (the NetLog Viewer doesn’t leak data), it’s always nice to be able to discard attack surface wherever possible.