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.

Sign up for GitHub

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

Jump to bottom

Search Block: remove id attribute from svg #40828

Merged
merged 3 commits into from
May 6, 2022
Merged

Search Block: remove id attribute from svg #40828

merged 3 commits into from
May 6, 2022

Conversation

amustaque97
Copy link
Member

@amustaque97 amustaque97 commented May 4, 2022 •
edited
Loading

Fixes: #40823

What?

id was same for every instance of search block in the given page/post.

Why?

id property should be removed so that it should not be same for every instance of search block which violates standards.

How?

Testing Instructions

  1. checkout to this PR.
  2. build and run the project.
  3. create a page/post.
  4. add multiple search blocks in that page/post.
  5. while adding search block make sure we select use button with icon from search block toolbar
  6. publish the page/post.
  7. validate if search icon SVG of the each block doesn't have any id attribute.

Screenshots or screencast

@amustaque97 amustaque97 added the [Block] Search Affects the Search Block - used to display a search field label May 4, 2022
@amustaque97 amustaque97 self-assigned this May 4, 2022
alexstine
alexstine reviewed May 4, 2022
View reviewed changes
Copy link
Contributor

@alexstine alexstine left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@amustaque97 One note below.

packages/block-library/src/search/index.php Outdated Show resolved Hide resolved
@amustaque97 amustaque97 marked this pull request as ready for review May 5, 2022 15:03
@amustaque97 amustaque97 requested a review from ajitbohra as a code owner May 5, 2022 15:03
andrewserong
andrewserong reviewed May 5, 2022
View reviewed changes
Copy link
Contributor

@andrewserong andrewserong left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for opening up this PR to address the issue!

I was wondering if instead of creating a unique id, if we could remove the id attribute altogether from the SVG icon. Does anyone know if the id attribute is currently in use for anything? I couldn't see anywhere that it's currently used for hooking into anything, and we already have a classname attached if folks are needing to target the icon in any theming, so I wondered if it'd be easier to remove it.

It looks like the SVG icon was originally added to the file (with the id included) in #24666.

@alexstine do you know if an id attribute on the svg element is required at all for accessibility, or if it's safe to remove?

@alexstine
Copy link
Contributor

@andrewserong Should be safe to remove. SVGs are hidden to screen readers anyway. 👍

@amustaque97 amustaque97 changed the title Search Block: make unique id attribute Search Block: remove id attribute from svg May 6, 2022
Mamaduka
Mamaduka approved these changes May 6, 2022
View reviewed changes
Copy link
Member

@Mamaduka Mamaduka left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me. Thanks, @amustaque97!

@amustaque97 amustaque97 merged commit 7aeaae5 into trunk May 6, 2022
@amustaque97 amustaque97 deleted the fix/unique-id-attribute branch May 6, 2022 09:42
@github-actions github-actions bot added this to the Gutenberg 13.3 milestone May 6, 2022
@Mamaduka Mamaduka mentioned this pull request Jul 12, 2022
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@andrewserong andrewserong andrewserong left review comments

@alexstine alexstine alexstine left review comments

@ramonjd ramonjd ramonjd left review comments

@Mamaduka Mamaduka Mamaduka approved these changes

@ajitbohra ajitbohra Awaiting requested review from ajitbohra ajitbohra is a code owner

Assignees

@amustaque97 amustaque97

Labels
[Block] Search Affects the Search Block - used to display a search field
Projects
None yet
Milestone
Gutenberg 13.3
Development

Successfully merging this pull request may close these issues.

Multiple Search blocks on same page with icon causing duplicate id with svg icon
5 participants
@amustaque97 @alexstine @Mamaduka @ramonjd @andrewserong