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

Highlight code for content selected when switching to Code Editor #26738

Open
SJNBham opened this issue Nov 5, 2020 · 2 comments
Open

Highlight code for content selected when switching to Code Editor #26738

SJNBham opened this issue Nov 5, 2020 · 2 comments
Labels
[Feature] Code Editor Handling the code view of the editing experience Needs Accessibility Feedback Need input from accessibility Needs Design Feedback Needs general design feedback. [Type] Enhancement A suggestion for improvement.

Comments

@SJNBham
Copy link

SJNBham commented Nov 5, 2020

It would be great to have the Code Editor highlight and jump to the section of HTML when the user selects content in the Visual Editor and then switches to the Code Editor view. The selection could be made by left-clicking and dragging in the Visual Editor to highlight specific text. It would be even better if you could left-click on one or more blocks and then have those highlighted in code view as well. But being able to select text visually and then switch to the section of code where that text appears would a great start. It would save time scrolling or starting an on-page find operation using the browser search function. This would be useful when trying to troubleshoot content issues.

@mapk mapk added [Feature] Code Editor Handling the code view of the editing experience [Type] Enhancement A suggestion for improvement. Needs Design Needs design efforts. Needs Accessibility Feedback Need input from accessibility Needs Design Feedback Needs general design feedback. and removed Needs Design Needs design efforts. labels Nov 10, 2020
@mapk
Copy link
Contributor

mapk commented Nov 11, 2020

Here's how this might look with existing text highlights. This option drops the focus into the Code Editor immediately though. I'm not sure how this works with accessibility. Currently, after selecting "Code Editor", the focus remains in the Options dropdown.

Selected text

highlighted-text

Selected blocks

highlighting-blocks

@sophiegyo
Copy link

This is something I've also been wondering about for myself, I tested it again now and for me the highlighting/focus simply does not persist for me at all, whether I start from the visual editor to code, or whether I highlight one or more entire blocks in code and switch to visual.

Specs:
Firefox v89.0.2
Mac OS 11.4
WP v5.7.2
Gutenberg v11.0.0

Video from today (sorry for potato quality, you can just about see the focus not persisting):

highlightnope2.-.SD.480p.mov

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Code Editor Handling the code view of the editing experience Needs Accessibility Feedback Need input from accessibility Needs Design Feedback Needs general design feedback. [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

No branches or pull requests

3 participants