New XSS Vectors | PortSwigger Search


Gareth Heyes



  • Published: April 20, 2022 at 14:00 UTC

  • Update: April 20, 2022 at 14:07 UTC

A code snippet showing a new XSS vector

Events based on transitions without style blocks

So recently I was updating our XSS cheat sheet to fix some vectors made obsolete by browser updates. Looking at the vectors, the transition events stuck in my head. They needed a style block as well as the event:

I wanted to remove the requirement for a style block. I wondered what browser styles are added by default? I did a bit of research on Google and a page on W3Schools led me to my discovery. Some tags had focus selectors – this was super interesting, as it would mean a transition would work with them! Scrolling through the list, I noticed that the outline was used, then I remembered that Chrome puts an outline around an element when you make it focusable for accessibility.

This meant that we could remove the style block requirement if we applied the transition to the outline property. This vector works with any focusable tag:


Happy XSS hacking! Like the good old times.

SVG “use” element vectors

A while ago I found some nice SVG-based vectors that you might not be familiar with. A recent browser update changed the behavior of the “use” element in Chrome and Firefox. You can now automatically run JavaScript with embedded SVG in data URLs of a “use” element:

Here is the decoded base64:

xmlns:xlink='' width="100" height="100">

Of course, you don’t have to use base64 – you can also:

#x" />

Finally, you can use animated tags to modify the href of the “use” element to cause JavaScript to run:

#x" />

If you liked these vectors and want to learn more, I recommend the XSS section of our Web Security Academy where you can hone your skills with our interactive labs – or visit our XSS cheat sheet to learn more.

XSS Cross Site Scripting Vectors

Back to all articles


About Author

Comments are closed.