search

jhamlet / svg-react-loader

Webpack SVG to React Component Loader
MIT License
559 stars 82 forks source link

clipPathUnits is being renamed to kebab-case version which breaks functionality #122

Open vitaliyrtest1 opened 4 years ago

vitaliyrtest1 commented 4 years ago

Hello!

When using clipPathUnits attribute in svgs, svg-react-loader renames this attribute to kebab version clip-path-units, which actually breaks functionality of this attribute.

I've been testing this for hours until found the bug :(

Right now I'm loading this SVG as text and insert as it is, but I guess it will be good to fix this bug.

Example svg:

<svg>
  <defs>
    <clipPath id="header-background-path" clipPathUnits="objectBoundingBox" transform="scale(0.002777778, 0.005747126)">
      <path d="M0,0 L360,0 L360,124 C311.942708,144 254.8125,154 188.609375,154 C122.40625,154 59.5364583,160.666667 0,174 L0,0 Z" />
    </clipPath>
  </defs>
</svg>

Expected result - as it is.

Actual result:

...
<clipPath id="header-background-path" clip-pathunits="objectBoundingBox" transform="scale(0.002777778, 0.005747126)">
...