sakura/debug.html at master · wizard404error/sakura · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<!doctype html>
<html>
<head><meta charset="utf-8"><title>Debug</title>
<style>body { background: #222; color: #fff; font-family: monospace; padding: 20px; }</style>
</head>
<body>
<h1>Debug: All .character elements in the DOM</h1>
<pre id="out">Loading...</pre>
<script type="module">
import "./src/styles/globals.css";
</script>
<script type="module">
const out = document.getElementById("out");
function dump() {
  const list = [];
  document.querySelectorAll(".character, [class*=character], [class*=sprite], [class*=live2d], [class*=svg]").forEach((el) => {
    const r = el.getBoundingClientRect();
    const cs = getComputedStyle(el);
    list.push({
      tag: el.tagName,
      cls: el.className.toString().slice(0, 80),
      rect: { x: Math.round(r.x), y: Math.round(r.y), w: Math.round(r.width), h: Math.round(r.height) },
      position: cs.position,
      width: cs.width,
      maxWidth: cs.maxWidth,
      height: cs.height,
      maxHeight: cs.maxHeight,
      overflow: cs.overflow,
      src: el.src ? el.src.slice(-60) : "",
    });
  });
  out.textContent = JSON.stringify(list, null, 2);
}
setTimeout(dump, 500);
setTimeout(dump, 2000);
</script>
</body>
</html>