Skip to content

Fails to detect when absolute positioned dom is covering Japanese text #2337

Open
@melink14

Description

@melink14

Example: New reddit browse page post snippets are covered in a big anchor tag that blocks all text.

One idea that worked in a simple devtools test is to save the blocking dom, recheck for the range and then add it back. Something like:

const savedStartNode = range.startContainer';
const replacement = document.creeateElement('div');
savedStartNode.replaceWith(replacement);
range = document.caretRangeAtPosition(...);
// <insert code here>
replacement.replaceWith(savedStartNode)

Hopefully this would keep everything intact and be invisible to the user but I'm not 100% sure.

Decisions to make:

  • When to apply this logic?
    • Whenever start container is absolute? (probably this should be a condition though maybe there are other display styles that can cover content)
    • Whenever start container is not text node (has no data)? This would also help clean up our types.
    • Could see if any results are returned first and if not then could re-run with the node removed to see if better results.

We'll also need to fix #2336 since the event target will certainly be wrong if the original event target was the absolutely positioned element.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions