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

USWDS - Icons: Remove internal UMD code for SVG4Everybody polyfill. #4035

Merged
merged 2 commits into from
Mar 1, 2021

Conversation

mejiaj
Copy link
Contributor

@mejiaj mejiaj commented Feb 25, 2021

Description

SVG4Everybody polyfill is used to convert SVG sprite icons to an embedded format so IE11 can render them. The code included to create a UMD module is causing conflicts when we pass it through Babel for older browsers. Removed it based on this Slack comment by Andrew Duthie

Modern browsers

<svg class="usa-icon" aria-hidden="true" focusable="false" role="img">
  <use xlink:href="../../dist/img/sprite.svg#add"></use>
</svg>

IE11 (after SVG4E)

<svg xmlns="http://www.w3.org/2000/svg" class="usa-icon" role="img" aria-hidden="true" viewBox="0 0 24 24" focusable="false">
  <g>
    <path fill="none" d="M 0 0 h 24 v 24 H 0 Z" />
    <path d="M 19 13 h -6 v 6 h -2 v -6 H 5 v -2 h 6 V 5 h 2 v 6 h 6 v 2 Z" />
  </g>
</svg>

Additional information

Now you should be able to use uswds.js or uswds.min.js in a React app without any problems.

Thanks to @aduth for looking into this and providing a solution!

Before you hit Submit, make sure you’ve done whichever of these applies to you:

  • Follow the 18F Front End Coding Style Guide and Accessibility Guide.
  • Run npm test and make sure the tests for the files you have changed have passed.
  • Run your code through HTML_CodeSniffer and make sure it’s error free.
  • Title your pull request using this format: [Website] - [UI component]: Brief statement describing what this pull request solves.

Copy link

@sarnikbixal sarnikbixal left a comment

Choose a reason for hiding this comment

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

I have tested this and can confirm this works

@mejiaj mejiaj added this to Development review in USWDS Sprint Board via automation Feb 25, 2021
@mejiaj mejiaj moved this from Development review to Fed final review in USWDS Sprint Board Feb 26, 2021
@thisisdano thisisdano merged commit 6962754 into develop Mar 1, 2021
USWDS Sprint Board automation moved this from Fed final review to Done Mar 1, 2021
@thisisdano thisisdano deleted the jm-svg4everybody-hotfix branch March 1, 2021 17:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Development

Successfully merging this pull request may close these issues.

None yet

4 participants