Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add shadow DOM getter for all types of elements #115

Open
forgetso opened this issue Feb 1, 2024 · 1 comment
Open

Add shadow DOM getter for all types of elements #115

forgetso opened this issue Feb 1, 2024 · 1 comment

Comments

@forgetso
Copy link
Owner

forgetso commented Feb 1, 2024

At the moment, a shadow DOM search is performed for matching inputs with the same name or value. This type of search could be extended to any DOM element with the same matching value in a shadow DOM.

function replaceInInputShadow(
input: HTMLInputElement | HTMLTextAreaElement,
config: SearchReplaceConfig,
newValue: string
) {
if (config.shadowRoots.length) {
config.shadowRoots.map((shadowRoot) => {
let shadowInputs = Array.from(shadowRoot.querySelectorAll(`input[id="${input['id']}"]`))
if (!shadowInputs.length) {
shadowInputs = Array.from(shadowRoot.querySelectorAll(`input[name="${input['name']}"]`))
}
if (!shadowInputs.length) {
shadowInputs = Array.from(shadowRoot.querySelectorAll(`input[value="${input['value']}"]`))
}
if (!shadowInputs.length) {
// perform less exact search
shadowInputs = Array.from(shadowRoot.querySelectorAll(`*[value="${input['value']}"]`))
}
if (shadowInputs.length) {
shadowInputs.map((shadowInput) => {
shadowInput['value'] = newValue
shadowInput.dispatchEvent(new Event('input', { bubbles: true }))
})
shadowRoot.host.dispatchEvent(new Event('input', { bubbles: true }))
}
})
}
}

@forgetso
Copy link
Owner Author

forgetso commented Feb 2, 2024

See https://www.rottentomatoes.com/m/the_arc_of_oblivion for an example of shadow root in practice.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant