This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const changeableBuiltInNames = []; | |
getChangeableBuiltInNamesRecursively(globalThis, "globalThis"); | |
function getChangeableBuiltInNamesRecursively(obj, accessors) { | |
if ( | |
obj === undefined || | |
obj === null || | |
obj instanceof String || | |
obj.__proto__ === String.prototype || | |
(accessors !== "globalThis" && obj === globalThis) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
window["record"] = []; | |
// The recording starts when you set it as true. | |
// Otherwise, the process in this file would be also recorded. | |
window["isRecorded"] = false; | |
const changeableBuiltInNames = getChangeableBuiltInNames(); | |
for (const name of changeableBuiltInNames) { | |
let target = window; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* It returns NEW array sorted by shadow(-and-iframe)-including tree order. | |
* `shadow-including tree order`: https://dom.spec.whatwg.org/#concept-shadow-including-tree-order | |
* (If you want the typed version, plz check out the TS version.) | |
*/ | |
function sortNodesByTreeOrder(nodes) { | |
return nodes.slice().sort((a, b) => { | |
if (!a.isConnected && !b.isConnected) { | |
return 0 | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
type DocumentOrElement = Document | Element | |
/** | |
* It returns NEW array sorted by shadow(-and-iframe)-including tree order. | |
* `shadow-including tree order`: https://dom.spec.whatwg.org/#concept-shadow-including-tree-order | |
*/ | |
function sortNodesByTreeOrder<T extends DocumentOrElement | Element>( | |
nodes: T[] | |
): T[] { | |
return nodes.slice().sort((a, b) => { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const cname = "movearound-text-domdom-enjoy" | |
addClassToTextsAndImagesRecursively(document.body) | |
const targets = Array.from(document.getElementsByClassName(cname)) | |
setInterval(() => oscillateElements(targets), 100) | |
function addClassToTextsAndImagesRecursively(root) { | |
if (root.tagName === "HEAD" || root.tagName === "SCRIPT" || root.tagName === "STYLE") return | |
const extendedChildNode = (node) => node.firstChild || node.shadowRoot || node.contentDocument |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
;(function overwriteTextNodes(root, yourText) { | |
const extendedChildNode = (node) => | |
node.firstChild || node.shadowRoot || node.contentDocument | |
for (let node = extendedChildNode(root); node; node = node.nextSibling) { | |
node.nodeType === 3 && (node.nodeValue = yourText) | |
overwriteTextNodes(node, yourText) | |
} | |
})(document.body, "👶") |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// 3D Dom viewer, copy-paste this into your console to visualise the DOM as a stack of solid blocks. | |
// You can also minify and save it as a bookmarklet (https://www.freecodecamp.org/news/what-are-bookmarklets/) | |
(() => { | |
const SHOW_SIDES = false; // color sides of DOM nodes? | |
const COLOR_SURFACE = true; // color tops of DOM nodes? | |
const COLOR_RANDOM = false; // randomise color? | |
const COLOR_HUE = 190; // hue in HSL (https://hslpicker.com) | |
const MAX_ROTATION = 180; // set to 360 to rotate all the way round | |
const THICKNESS = 20; // thickness of layers | |
const DISTANCE = 10000; // ¯\\_(ツ)_/¯ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// after runnig this code on the console, click click click as fast as possible. | |
let a = null | |
let results = [] | |
window.addEventListener('click', (e) => { | |
if (a === null){ | |
a = performance.now() | |
return | |
} | |
const b = performance.now() |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const sleep = (ms) => { | |
const now = performance.now() | |
while (performance.now() - now < ms) { | |
// wait | |
} | |
} | |
(function setSleepRepeatedly() { | |
Promise.resolve().then(() => { | |
sleep(3000) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// The implementation is based on https://developers.cyberagent.co.jp/blog/archives/36573/ | |
import 'package:flutter/material.dart'; | |
import 'package:flutter/rendering.dart'; | |
void main() { | |
WidgetsFlutterBinding.ensureInitialized(); | |
// Auto-enable accessibility for our Blind and Low Vision customers. | |
// RendererBinding.instance.accessibilityFeatures |