4 ms·

They probably reimplement entirely from scratch by getting the position of the mouse and listening to click events.

azinman2 5y ago
Meaning they're creating text dynamically with the click event? I'd assume that'd be chicken-and-egg where the browser wouldn't respond to the click event if there's no text to select?
- progval 5y ago
  No, I mean they would draw the selection themselves on the canvas. And they would get the event simply because the user clicked on the canvas.
  - azinman2 5y ago
    But that's not happening, as I'm able to select text on iOS Safari and have it give me the copy/paste options above it. If the text wasn't available, it would also completely break any kind of screen reader / accessibility feature so something has to be supporting this at a native-browser level.
    - progval 5y ago
      I don't know about iOS, but on Firefox Desktop, the right-click menu is emulated by the canvas, and it uses the clipboard API to copy it. > If the text wasn't available, it would also completely break any kind of screen reader / accessibility feature so something has to be supporting this at a native-browser level. When using a screen reader, it tells you you press Ctrl+Alt+Z, which loads an iframe containing (only?!) the first paragraph of the text, so it is made available to screen readers independently. I have no idea if this would work for editing though.
      - azinman2 5y ago
        It looks like on Safari on macOS they also hijack right-click menu, but text selection works such that I can go to Edit>Copy and it works. What tells you to press Ctrl+Alt+Z? That's not a great experience for you to interactively edit a document if you have accessibility needs.
        progval 5y ago
        > What tells you to press Ctrl+Alt+Z? Invisible text inserted in the DOM with Javascript (forgive the French, it ignores browser settings and seems to use geolocation): <div id="docs-aria-speakable" class="docs-offscreen-z-index" aria-live="assertive" role="region" aria-atomic="true" aria-hidden="false">Pour activer la compatibilité avec le lecteur d'écran, appuyez sur Ctrl+Alt+Z Pour connaître les raccourcis clavier, appuyez sur Ctrl+barre oblique</div>
        azinman2 5y ago
        Wonder what happens in a mobile device context, where you can't execute such a shortcut. But that's interesting, especially the class="docs-offscreen-z-index". This to me suggests that they do have shadow elements underneath the canvas to support various functionality. Thanks for the find!
augustl 5y ago
And this is not new, they already do that with the current dom renderer. One div for each wrapped line of text, divs for selection, cursor is a CSS animated div, etc

Meaning they're creating text dynamically with the click event? I'd assume that'd be chicken-and-egg where the browser wouldn't respond to the click event if there's no text to select?

progval 5y ago
No, I mean they would draw the selection themselves on the canvas. And they would get the event simply because the user clicked on the canvas.
- azinman2 5y ago
  But that's not happening, as I'm able to select text on iOS Safari and have it give me the copy/paste options above it. If the text wasn't available, it would also completely break any kind of screen reader / accessibility feature so something has to be supporting this at a native-browser level.
  - progval 5y ago
    I don't know about iOS, but on Firefox Desktop, the right-click menu is emulated by the canvas, and it uses the clipboard API to copy it. > If the text wasn't available, it would also completely break any kind of screen reader / accessibility feature so something has to be supporting this at a native-browser level. When using a screen reader, it tells you you press Ctrl+Alt+Z, which loads an iframe containing (only?!) the first paragraph of the text, so it is made available to screen readers independently. I have no idea if this would work for editing though.
    - azinman2 5y ago
      It looks like on Safari on macOS they also hijack right-click menu, but text selection works such that I can go to Edit>Copy and it works. What tells you to press Ctrl+Alt+Z? That's not a great experience for you to interactively edit a document if you have accessibility needs.
      - progval 5y ago
        > What tells you to press Ctrl+Alt+Z? Invisible text inserted in the DOM with Javascript (forgive the French, it ignores browser settings and seems to use geolocation): <div id="docs-aria-speakable" class="docs-offscreen-z-index" aria-live="assertive" role="region" aria-atomic="true" aria-hidden="false">Pour activer la compatibilité avec le lecteur d'écran, appuyez sur Ctrl+Alt+Z Pour connaître les raccourcis clavier, appuyez sur Ctrl+barre oblique</div>
        azinman2 5y ago
        Wonder what happens in a mobile device context, where you can't execute such a shortcut. But that's interesting, especially the class="docs-offscreen-z-index". This to me suggests that they do have shadow elements underneath the canvas to support various functionality. Thanks for the find!

augustl 5y ago

And this is not new, they already do that with the current dom renderer. One div for each wrapped line of text, divs for selection, cursor is a CSS animated div, etc