Cross browser devtools

[crisdosaygo]

I'm sorry this will probably be the stupidest PR you see this year, but I want the wonderful devtools-frontend to be able to work in Firefox and Safari. Currently it does not.

There may be lots of work to get this ready, and I'm sure this will seem like a highly stupid, useless and unimportant change to implement for the Chrome team because this is Chrome devtools-frontend afterall.

This PR tracks work regarding that.

The first change involved adding a polyfill for constructible stylesheets as new CSSStyleSheet does not work in Firefox or Safari. It may be possible to revert this polyfill addition in future, as Firefox might be implementing this API.

devtools-frontend uses constructible stylesheets and they appear in the generated CSS JavaScript files. The following is an example, the first few lines of devtools/Images/Images.js:

// Copyright 2021 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
const sheet = new CSSStyleSheet();
sheet.replaceSync(':root {}');
const style = sheet.cssRules[0].style;

style.setProperty('--image-file-accelerometer-bottom', 'url(' + new URL('./accelerometer-bottom.png', import.meta.url).toString() + ')');

These are the types of non-cross-browsers APIs that are currently blocking devtools-frontend from working cross-browser.

I'm sure you folks are incredibly busy as well, so I totally get if you're too busy to look at this or if anything else makes it impossible for you, and no worries at all, just thanks for reading this far!

[bmeurer]

Thanks for the PR. Generally I'm not opposed to having support for browsers other than Chromium, however our team will not be able to actively maintain that support and ensure that things are still working, so some kind of commitment needs to be there first on your end.

Also we don't use GitHub for issue tracking and code review, so please file a tracking bug on crbug.com and submit code changes via Gerrit. The README has all the relevant pointers and information.

[crisdosaygo]

Thank you @bmeurer for the invitation, I'll consider if I can make this commitment, and follow the process you describe if I can!

[crisdosaygo]

Hey @bmeurer, hope you're well and thanks again for the invitation. I've considered this and decided that I can commit to actively maintain that support and ensure that things are still working. I've just cloned depot_tools and fetched devtools-frontend, and updated to latest. I'll open a tracking bug on crbug, and submit code changes to Gerrit. I have no idea what I'm doing with any of this, and this devtools workflow is almost completely new to me so it will take me some time to set up. I'll follow the README, but I'm sorry I may need to reach out to you or someone else if I get stuck on something. I apologize in advance for any trouble this causes you.

Serendipitously, it's now 144 days / 3,456 hours since this PR, and I think it's an time for me to do some work on it. Thank you again, have a good one!