Update Elements with ID lister to 1.0.12

- Set `all` to `initial` (https://lamplightdev.com/blog/2019/03/26/why-is-my-web-component-inheriting-styles/)
- See the `name` attribute in anchor tags as IDs (https://wayland.freedesktop.org/docs/html/apb.html)
- Attempt to get text by going up the DOM (https://wayland.freedesktop.org/docs/html/apb.html)
This commit is contained in:
blankie 2023-08-01 17:04:50 +10:00
parent 906974ae67
commit 03debb468a
Signed by: blankie
GPG Key ID: CC15FC822C7F61F5
1 changed files with 22 additions and 9 deletions

View File

@ -6,7 +6,7 @@
// @grant GM_getResourceURL
// @require https://cdn.jsdelivr.net/npm/dialog-polyfill@0.5.6/dist/dialog-polyfill.min.js#sha256-cec1a2e320aab77e28bad4ad6bc5e532a6ef5757345c19bb5158aa880b7162a6
// @resource dialogPolyfillCSS https://cdn.jsdelivr.net/npm/dialog-polyfill@0.5.6/dist/dialog-polyfill.min.css#sha256-4dcb3ab62e545f30bf06a4824c253641ee889ca85ca28d5447590557922496ab
// @version 1.0.11
// @version 1.0.12
// @author blankie
// @description A userscript that adds a "Show elements popup" option to the Monkey Menu which lists all elements with an ID
// @inject-into content
@ -19,7 +19,9 @@ const ACCENT_COLOR = "#962AC3";
const BRIGHT_ACCENT_COLOR = "#DE6DE6";
const DIALOG_WRAPPER_CSS = `
all: unset;
/* https://lamplightdev.com/blog/2019/03/26/why-is-my-web-component-inheriting-styles/ */
all: initial;
position: fixed;
top: 0;
width: 100%;
@ -32,7 +34,6 @@ dialog {
max-height: 90%;
max-width: 90%;
font-size: 11pt;
text-align: left;
font-family: sans-serif;
color-scheme: dark;
overflow-y: auto;
@ -143,7 +144,7 @@ function hideElementList() {
function getElementList() {
let elements = [];
for (let element of document.body.querySelectorAll("[id]")) {
for (let element of document.body.querySelectorAll("[id], a[name]")) {
if (shouldIgnoreElement(element)) {
continue;
}
@ -155,9 +156,12 @@ function getElementList() {
function shouldIgnoreElement(element) {
// Check if the element is not visible
let rect = element.getBoundingClientRect();
if (rect.height === 0 || rect.width === 0) {
return true;
// https://wayland.freedesktop.org/docs/html/apb.html has <a name=...> elements with no size
if (element.localName !== "a") {
let rect = element.getBoundingClientRect();
if (rect.height === 0 || rect.width === 0) {
return true;
}
}
// Check if the element is a svg or a part of one
@ -174,11 +178,15 @@ function shouldIgnoreElement(element) {
function getElementListItem(element) {
let newLocation = new URL(location.href);
let id = element.id;
if (!id && element.localName === "a") {
id = element.name;
}
let li = document.createElement("li");
let a = document.createElement("a");
newLocation.hash = a.innerText = "#" + element.id;
newLocation.hash = a.innerText = "#" + id;
a.href = newLocation.href;
a.addEventListener("click", function(e) {
if (e.ctrlKey) {
@ -198,7 +206,12 @@ function getElementListItem(element) {
function getElementDescription(element) {
let addEilipses = false;
let text = (element.innerText || "").trim();
// Attempt to get text by going up the DOM, as https://wayland.freedesktop.org/docs/html/apb.html has elements with no content
let text = "";
while (!text && element) {
text = (element.innerText || "").trim();
element = element.parentElement;
}
let newlineIndex = text.indexOf("\n");
if (newlineIndex !== -1) {