Shield JS 🛡️

This is DIV#aaa

Since it's in the allowlist, it is allowed to be clobbered
This means attempting to access it will return DIV#aaa DOM node (click here to see)

This is DIV#bbb

Since it's NOT in the allowlist, it is NOT allowed to be clobbered
This means attempting to access it will throw an Error (click here to see)

• Open the console and try setting the "id" attribute of any DOM node to any value, and then try accessing it via window[YOUR_VALUE] - this will throw an Error as well.
• Idea 💡 This shim can easily be manifested as a new CSP directive, for example:
  • Content-Security-Policy: "dom-clobbering: 'aaa'"

Try it yourself: (access is allowed) Run (⌘ + ↵ / ^ + ↵)