Heading outline https://twitter.com/stowball/status/1255867982510559234

heading-outline-bookmarklet.js

javascript:(function()%7Bconsole.log(%0A%20%20Array.from(document.querySelectorAll('h1%2C%20h2%2C%20h3%2C%20h4%2C%20h5%2C%20h6')).reduce((str%2C%20heading%2C%20index%2C%20arr)%20%3D%3E%20%7B%0A%20%20%20%20const%20level%20%3D%20Number(heading.tagName.slice(1))%3B%0A%0A%20%20%20%20if%20(level%20%3D%3D%3D%201%20%26%26%20heading.textContent%20%3D%3D%3D%20'No%20Preview')%20%7B%0A%20%20%20%20%20%20return%20str%3B%0A%20%20%20%20%7D%0A%0A%20%20%20%20const%20previousLevel%20%3D%20index%20%3D%3D%3D%200%20%3F%20level%20%3A%20Number(arr%5Bindex%20-%201%5D.tagName.slice(1))%3B%0A%20%20%20%20const%20indentation%20%3D%20(level%20-%20previousLevel%20%3E%201%20%3F%20'*'%20%3A%20'-').repeat(level)%3B%0A%20%20%20%20const%20isAriaHidden%20%3D%20heading.getAttribute('aria-hidden')%20%3D%3D%3D%20'true'%3B%0A%20%20%20%20const%20isDisplayNone%20%3D%20getComputedStyle(heading).display%20%3D%3D%3D%20'none'%3B%0A%20%20%20%20const%20isVisibilityHidden%20%3D%20getComputedStyle(heading).visibility%20%3D%3D%3D%20'hidden'%3B%0A%20%20%20%20const%20isVisuallyHidden%20%3D%20getComputedStyle(heading).clip%20!%3D%3D%20'auto'%3B%0A%20%20%20%20const%20ariaLabel%20%3D%20heading.getAttribute('aria-label')%3B%0A%20%20%20%20const%20addendum%20%3D%20(isAriaHidden%20%7C%7C%20!!ariaLabel%20%7C%7C%20isDisplayNone%20%7C%7C%20isVisibilityHidden%20%7C%7C%20isVisuallyHidden)%20%3F%20%60%20(%24%7BisAriaHidden%20%3F%20'aria%20hidden'%20%3A%20''%7D%24%7B!!ariaLabel%20%3F%20'aria%20label'%20%3A%20''%7D%24%7BisDisplayNone%20%3F%20'display%3Anone'%20%3A%20''%7D%24%7BisVisibilityHidden%20%3F%20'visibility%3Ahidden'%20%3A%20''%7D%24%7BisVisuallyHidden%20%3F%20'visually%20hidden'%20%3A%20''%7D)%60%20%3A%20''%3B%0A%0A%20%20%20%20return%20%60%24%7Bstr%7D%24%7Bindentation%7D%20%24%7Bheading.tagName%7D%3A%20%24%7B!!ariaLabel%20%3F%20ariaLabel%20%3A%20heading.textContent.replace(%2F%5B%5Cr%5Cn%5D%2Fg%2C%20'%20').replace(%2F%5Cs%2B%2Fg%2C%20'%20').trim()%7D%24%7Baddendum%7D%5Cn%60%3B%0A%20%20%7D%2C%20'')%0A)%3B%7D)()%3B

heading-outline.js

console.log(
  Array.from(document.querySelectorAll('h1, h2, h3, h4, h5, h6')).reduce((str, heading, index, arr) => {
    const level = Number(heading.tagName.slice(1));

    if (level === 1 && heading.textContent === 'No Preview') {
      return str;
    }

    const previousLevel = index === 0 ? level : Number(arr[index - 1].tagName.slice(1));
    const indentation = (level - previousLevel > 1 ? '*' : '-').repeat(level);
    const isAriaHidden = heading.getAttribute('aria-hidden') === 'true';
    const isDisplayNone = getComputedStyle(heading).display === 'none';
    const isVisibilityHidden = getComputedStyle(heading).visibility === 'hidden';
    const isVisuallyHidden = getComputedStyle(heading).clip !== 'auto';
    const ariaLabel = heading.getAttribute('aria-label');
    const addendum = (isAriaHidden || !!ariaLabel || isDisplayNone || isVisibilityHidden || isVisuallyHidden) ? ` (${isAriaHidden ? 'aria hidden' : ''}${!!ariaLabel ? 'aria label' : ''}${isDisplayNone ? 'display:none' : ''}${isVisibilityHidden ? 'visibility:hidden' : ''}${isVisuallyHidden ? 'visually hidden' : ''})` : '';

    return `${str}${indentation} ${heading.tagName}: ${!!ariaLabel ? ariaLabel : heading.textContent.replace(/[\r\n]/g, ' ').replace(/\s+/g, ' ').trim()}${addendum}\n`;
  }, '')
);