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

[Bug]: Workflow Icons and UI Icons: some attributes are missing quotation marks #4664

Closed
1 task done
cris-graphics opened this issue Aug 8, 2024 · 4 comments · Fixed by #4442
Closed
1 task done
Assignees
Labels
1.0.0 Issues that should be addressed for a 1.0 release! bug Something isn't working Component: Icon good first issue Good for newcomers needs jira ticket

Comments

@cris-graphics
Copy link

cris-graphics commented Aug 8, 2024

Code of conduct

  • I agree to follow this project's code of conduct.

Impacted component(s)

Icons UI, Icons Workflow

Expected behavior

No response

Actual behavior

I am trying to render some icons as described in the 'Extended use case' section of the docs.

import { AbcIcon } from '@spectrum-web-components/icons-workflow/src/icons.js';

console.log(AbcIcon());

When I log the result to the console I get an output like this:

 <svg
    xmlns="http://www.w3.org/2000/svg"
    height=24
    viewBox="0 0 36 36"
    width=24
    aria-hidden=false
    role="img"
    fill="currentColor"
    aria-label=Abc
  >
    <path
      d="m4.936 20.484-1.1 3.322a.235.235 0 0 1-.259.194H.988c-.172 0-.216-.086-.172-.237 1.143-3.236 2.976-8.543 4.335-12.275a3.813 3.813 0 0 0 .216-1.337.136.136 0 0 1 .151-.151h3.473a.162.162 0 0 1 .173.108c1.575 4.336 3.3 9.276 4.9 13.676.064.151.021.216-.13.216h-2.85a.193.193 0 0 1-.216-.151L9.66 20.484Zm4.055-2.459C8.56 16.558 7.7 14.1 7.265 12.545h-.021c-.324 1.467-1.1 3.732-1.661 5.48Z"
    />
    <path
      d="M14.045 10.257c0-.15.022-.193.129-.214.943-.022 2.743-.043 4.565-.043 4.436 0 5.379 1.95 5.379 3.686a3.1 3.1 0 0 1-2.036 3v.043a3.309 3.309 0 0 1 2.572 3.236c0 2.658-2.294 4.029-6.194 4.029-1.65.022-3.386-.021-4.265-.043a.17.17 0 0 1-.15-.193Zm2.979 5.379h1.865c1.714 0 2.25-.707 2.25-1.628 0-1.158-.772-1.629-2.422-1.629-.836 0-1.5.021-1.693.043Zm0 5.937c.236 0 .729.042 1.608.042 1.8 0 2.871-.471 2.871-1.8 0-1.114-.686-1.757-2.593-1.757h-1.886ZM32.752 10a7.959 7.959 0 0 1 2.946.439c.1.063.126.1.126.251v2.21c0 .189-.1.189-.188.147a7.061 7.061 0 0 0-2.779-.523 4.175 4.175 0 0 0-4.535 4.43c0 3.427 2.466 4.388 4.514 4.388a8.49 8.49 0 0 0 2.925-.5c.1-.042.167 0 .167.125v2.152c0 .147-.021.23-.167.293a8.621 8.621 0 0 1-3.448.588c-3.74 0-7.041-2.069-7.041-6.958 0-3.991 2.928-7.042 7.48-7.042Z"
    />
  </svg>

As You can see, width, height, aria-hidden and aria-label are missing quotation marks.
I'm not a pro, but could these lines be 'causing the wrong output?

return html\`${$('svg')
.toString()
.replace('width="..."', 'width=${width}')
.replace('height="..."', 'height=${height}')
.replace('aria-label="..."', 'aria-label=${title}')}\`;

Thanks for looking into it.
Cris

Screenshots

No response

What browsers are you seeing the problem in?

No response

How can we reproduce this issue?

  1. Go to '...'
  2. Click on '....'
  3. Scroll to '....'
  4. Check console
  5. See error

Sample code that illustrates the problem

No response

Logs taken while reproducing problem

No response

@cris-graphics cris-graphics added bug Something isn't working needs jira ticket triage An issue needing triage labels Aug 8, 2024
@najikahalsema
Copy link
Collaborator

@cgundermann Hi! Two questions.
Which team are you on? Is this issue blocking for you?
We will fix this, but just want to make sure we're delivering the fix in an appropriate time frame.

@najikahalsema najikahalsema added 1.0.0 Issues that should be addressed for a 1.0 release! Component: Icon good first issue Good for newcomers and removed triage An issue needing triage labels Oct 9, 2024
@cris-graphics
Copy link
Author

cris-graphics commented Oct 9, 2024

Hi @najikahalsema,
I'm not on any team (it's not blocking for me).
I just stumbled upon this while developing a UXP plugin for Photoshop
and thought I'd let You know =)

@TarunAdobe TarunAdobe self-assigned this Oct 14, 2024
@TarunAdobe TarunAdobe linked a pull request Oct 14, 2024 that will close this issue
11 tasks
@Rajdeepc
Copy link
Contributor

@TarunAdobe Can we close this? I think we have added this in our foundations release!

@TarunAdobe
Copy link
Contributor

yesss... its done and already shipped hehe.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
1.0.0 Issues that should be addressed for a 1.0 release! bug Something isn't working Component: Icon good first issue Good for newcomers needs jira ticket
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants