arimgibson / Deadname-Remover

An easy to use Firefox and Chrome plugin to automatically remove and replace deadnames
MIT License
113 stars 30 forks source link

Compatibility with reactive front-end frameworks / Shadow DOM #483

Open twohue opened 2 years ago

twohue commented 2 years ago

I realize that the scope of this plugin can't account for everything. There are two significant areas in which this plugin has issues;

Form inputs - Since the targeting of this plugin is focused on text nodes, it's only operating on elements that are text nodes, and doesn't account for form inputs. Text inputs don't have any innerHTML, they have a value, and since this doesn't account for those, it won't work on form fields or elements that are self-closing or missing a closing tag.

That's not something I'd call a bug necessarily, just a caveat that should be noted.

The major issue that I'm running into is with how modern front-end libraries like VueJS, React, Angular and others that manipulate pages via a Shadow DOM will have issues when using this plugin. This focuses entirely on the "light DOM", which is the raw HTML structure of a page.

For performance reasons, many of these reactive frameworks use the Shadow DOM to do what they do, and because the Shadow DOM must be referenced directly to access it, this plugin won't work on sites with reactive frameworks handling the page structure.

This too, is not necessarily a 'bug', just a caveat that is to do with the nature of modern web development practices.

I would suggest covering these potential issues in the documentation for the plugins so that end users will better understand why the plugin may not appear to be working as expected in some circumstances.

arimgibson commented 2 years ago

Excuse my brevity as I catch up on a whole lot of issues that need to be reviewed

Thanks for the suggestion and detailed report @twohue ! I didn't realize that the extension currently doesn't work with the Shadow DOM (have experience interacting with Shadow DOM though). RIght now my energy is going into a v2 release which includes a substantial refactor and rewrite; let me see if that version is indeed compatible with the Shadow DOM

arimgibson commented 2 years ago

Form inputs are set to be covered in v2 :)

Shadow DOM issue is still present despite new document parsing method that's set to be implemented in v2; planning on fixing that. Love the idea of a caveat in the README, maybe for closed shadow doms or iframes

arimgibson commented 2 years ago

Added a very, very loosely tested fix on 65cb65b4602ed5e593e850a9779de37d623f225f. I've done a really bad job of incrementally making changes, and the whole v2 can't be tested properly as I broke the core functionality by refactoring. However, I tested it a bit on my end and it seemed to work... I'll keep updating here once I have some proper testing in place (cypress.io)