How to fix Grafana not loading in Firefox Developer Edition

For some reason, Grafana does not work in Firefox Developer Edition despite being claimed to be compatible with the last three versions of Firefox.

Since I didn't want to use Chrome, I decided to use Edge on Mac whenever I needed Grafana, which is less than ideal. My whole workflow is in Firefox; switching browsers is annoying.

So, I decided to investigate what I could do about it, and I'm happy to report I found a fix. Based on my idea, but with the code generated by Claude.ai

First, install TamperMonkey. You'll use this to load a custom JavaScript code to fix the JS errors in Grafana that prevent it from loading in Firefox.

Then create a new user script with the following code, but update the line with the @match to your Grafana domain:

// ==UserScript==
// @name         Grafana Reflect.getPrototypeOf Polyfill
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Polyfill for Reflect.getPrototypeOf to handle null values
// @match       https://grafana.example.com/*
// @grant        none
// @run-at       document-start
// @grant        unsafeWindow
// ==/UserScript==
(function() {
    'use strict';
    console.log("Grafana Firefox Handler script is running using TamperMonkey");
    const originalGetPrototypeOf = Reflect.getPrototypeOf;
    Reflect.getPrototypeOf = function(target) {
        if (target === null) {
            return null;
        }
        return originalGetPrototypeOf(target);
    };
})();

This fixed it for me because the error I was getting in the console was: Uncaught TypeError: target argument of Reflect.getPrototypeOf must be an object, got null

If it doesn't work for you, check the console and see if you can use the same approach.