☰

Make ChatGPT scrollable with keyboard

This app makes it scrollable by setting tabindex to outer div making it focusable

As of 2024-09-01. See the latest version.

  1. // ==UserScript==
  2. // @name         Make ChatGPT scrollable with keyboard
  3. // @namespace    http://tampermonkey.net/
  4. // @version      2024-09-01
  5. // @description  This app makes it scrollable by setting tabindex to outer div making it focusable
  6. // @author       Alexander Yaremchuk & ChatGPT
  7. // @match        https://chatgpt.com/*
  8. // @icon         https://www.google.com/s2/favicons?sz=64&domain=tampermonkey.net
  9. // @grant        none
  10. // @license      MIT
  11. // ==/UserScript==
  12.  
  13. function onNavigation() {
  14.   const style = "div.flex.flex-col.text-sm.md\\:pb-9";
  15.   const elem = document.querySelector(style);
  16.   if (elem) {
  17.     elem.setAttribute("tabindex", "1");
  18.     console.log("Scroll for ChatGPT completed successfully.");
  19.   } else {
  20.     console.log(`element with style ${style} not found.`);
  21.   }
  22. }
  23.  
  24. (function () {
  25.   ("use strict");
  26.   conole.log("Scroll for ChatGPT is starting");
  27.   if (
  28.     typeof document !== "undefined" &&
  29.     typeof MutationObserver !== "undefined"
  30.   ) {
  31.     conole.log("Scroll for ChatGPT setting a mutation listener");
  32.  
  33.     const callback = function (mutationsList, observer) {
  34.       for (let mutation of mutationsList) {
  35.         if (mutation.type === "childList") {
  36.           conole.log("Scroll for ChatGPT running onNavigation");
  37.           onNavigation();
  38.           break;
  39.         }
  40.       }
  41.     };
  42.  
  43.     const observer = new MutationObserver(callback);
  44.  
  45.     observer.observe(document.body, { childList: true, subtree: true });
  46.   }
  47. })();
  48.  
  49. module.exports = { onNavigation };