[ticket/17646] Use phrasing elements for the avatar placeholder - #6997
Open
ECYaz wants to merge 1 commit into
Open
[ticket/17646] Use phrasing elements for the avatar placeholder#6997ECYaz wants to merge 1 commit into
ECYaz wants to merge 1 commit into
Conversation
Copy link
Copy Markdown
Contributor
Sorry, something went wrong.
The letter avatar placeholder is rendered as nested divs, which is invalid inside phrasing contexts such as the paragraph on the group view page. Browsers eject the placeholder from the paragraph while parsing, so the DOM no longer matches the markup, and validators reject the page. Render the placeholder as spans instead; all of its styling addresses the classes and sets explicit display values, and as a flex item the initials element is blockified either way, so the rendering is unchanged. The functional test framework reads the logged in username from the first span inside the header profile link that is not the avatar, so the placeholder span must be excluded there as well. PHPBB-17646
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Checklist:
Tracker ticket:
https://tracker.phpbb.com/browse/PHPBB-17646
The markup reported in the ticket, with the placeholder inside <span class="avatar">, cannot be produced by current core, as that span only ever wraps image avatars. The real instance is the group view page, where the placeholder divs render inside a paragraph. Browsers eject the invalid divs from the paragraph while parsing, so the DOM no longer matches the delivered markup and validators reject the page.
The placeholder now renders as spans. Its styling addresses the classes with explicit display values and the initials element keeps its layout as a flex item, so rendering is identical everywhere. Verified on a live board, including the avatar cropper page where the show and hide cycle still restores the flex display.