-
Notifications
You must be signed in to change notification settings - Fork 4.1k
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
UI: Refactor PostTitle for easier select, deselect #5422
Conversation
I recall the complexity being needed because when we used to click on the "copy" button the title got unselected. I don't know if it's still the case with this PR, I'll test tomorrow. |
@youknowriad Yeah, I suspect (or hope at least) that the addition of |
Yeah, it looks like this branch is suffering the issue I'm describing above: you can't click the "copy" button. |
Hmm, another Firefox-specific focus issue 😞 It works in Chrome, I had tested it. Will debug Firefox now... |
Actually, I imagine it's the same issue we've been combatting for a while, which is that clicks on buttons don't trigger |
The changes in 43f7b85 add some normalization to https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus |
Appears that Safari suffers the same issue for links, so it's not possible to click the permalink. Obvious solution would be to include this in the Alternatively, I'm wondering if it makes sense for us to apply |
67f1c02
to
5487949
Compare
Nature of withFocusOutside is that there'll be a short delay between focus being lost from textarea and handleFocusOutside being called, causing the permalink display and title selected effects from dismissing out of sync. While we _can_ style based on textarea focus, we'd rather ensure sync. Ideally, there'd not be a delay from `withFocusOutside`. Also, we spend a fair bit of effort overriding styles from main.scss which shouldn't be applied to the title in the first place. Why do we assume there's a textarea element? This is abstracted into `Textarea` component, but we have no guarantee that's the tag rendered.
Safari does not count clicks on anchors as focus
See "Does tapping on a button give it the focus?" at: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
5487949
to
7f7f8b3
Compare
This pull request seeks to refactor the
PostTitle
component. Initially I started this changeset as merely moving padding from the container element to the textarea to allow it to be more clickable by a few pixels, but quickly discovered this is a complex component and, as far as I can tell until directed otherwise, needlessly so.The user-impacting results of these changes are:
14px
of dead zone padding)The technical results of these changes are:
div
wrapperwithFocusOutside
to simplify focus outside behaviors and normalize across browsersThis should have been multiple separate commits, but it unintentionally turned into a rabbit hole of changes 😬
Testing instructions:
Verify that you can easily select and unselect the title field.
Verify that you can still click the permalink options for a saved post upon selecting the title.
Verify that the permalink options are dismissed after typing within the field after selected.