Change dialog role to div on ChatGPT, so screen reader doesn't get trapped.

remove-trap.js

// ==UserScript==
// @name         Remove ChatGPT Dialog
// @namespace    http://tampermonkey.net/
// @version      2024-12-20
// @description  Remove the invisible dialog that traps screen readers!
// @author       Chi Kim
// @match        https://chatgpt.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=chatgpt.com
// @grant        none
// @run-at       document-start
// ==/UserScript==

(function() {
    'use strict';
    // Function to remove the dialog element
    function removeDialogIfExists() {
        const dialog = document.querySelector('[role="dialog"]');
        if (dialog) {
            console.log(dialog.outerHTML);
            dialog.setAttribute("role", "div");
        }
    }

    // Create a MutationObserver to watch for changes in the DOM
    const observer = new MutationObserver((mutationsList) => {
        for (const mutation of mutationsList) {
            if (mutation.type === 'childList') {
                // Check for the appearance of a new dialog element
                removeDialogIfExists();
            }
        }
    });

    // Start observing the document body
    observer.observe(document.body, {
        childList: true, // Watch for added or removed child elements
        subtree: true    // Include all descendants, not just direct children
    });

    // Initial check for the dialog in case it's already present
    removeDialogIfExists();
    // Your code here...
})();