☰

Auto-expanding text input areas

Makes it so text input areas vertically expand to fit the size of the text you have put inside, making it easier to visualize what you have written in full.

  1. // ==UserScript==
  2. // @name        Auto-expanding text input areas
  3. // @match       *://*/*
  4. // @version     1.0
  5. // @license     MIT
  6. // @namespace   https://greasyfork.org/en/users/1436613-gosha305
  7. // @author      gosha305
  8. // @description Makes it so text input areas vertically expand to fit the size of the text you have put inside, making it easier to visualize what you have written in full.
  9. // ==/UserScript==
  10.  
  11. function autoExpandTextareas() {
  12.   if (document.querySelector("textarea:not(.autoExpandable)")) {
  13.     document.querySelectorAll("textarea:not(.autoExpandable)").forEach((e) => {
  14.       e.classList.add("autoExpandable");
  15.       e.addEventListener("input", function () {
  16.         e.style.height = "auto";
  17.         e.style.height = e.scrollHeight + "px";
  18.       });
  19.     });
  20.   }
  21. }
  22.  
  23. window.onload = function () {
  24.   autoExpandTextareas();
  25.   new MutationObserver(autoExpandTextareas).observe(document.body, {
  26.     childList: true,
  27.     subtree: true,
  28.   });
  29. };