Possible bug in SVG Shapes?

Hey, I noticed that when I add a custom SVG shape to the asset library the "preserveAspectRatio=“none” bit gets stripped out. So causing the shape not to apply to the full width of the container.

Step I took.

  1. I added a custom shape as demonstrated by Leo following in this tutorial. I even used a shape from the same https://getwaves.io site. I tried adding the shape with and without optimization.

Result: The shape does not apply to the full width container.

  1. I studied the html source and could not see anything odd so,

  2. I added another full width container and applied an SVG shape that came with the GenerateBlocks plugin.

  3. I studied the html again and saw that the code of the ‘standard shape’ svg was a little bit different.

  4. Since SVG shapes are dynamically, I copied the SVG code from the ‘standard shape’ and pasted it in the Asset library overwriting the the code of the custom SVG.

  5. Now the new version copy of the ‘standard shape’ also lost the full width

  6. Comparing the two blocks and its SVG code again I saw that the "preserveAspectRatio=“none” bit was stripped out in my pasted version of the SVG code. So

  7. I inserted an html block and copy pasted the necessary html markup from the source code, including the SVG . I still looked cramped.

  8. In the html I added the stripped out bit and after that the shape turned out on the frond end as expected.

I hope above process makes sence. Here is the html code I ended up using in the block editor. A custom shpae with the preserve aspect ratio.

<div class="gb-container gb-container-45ad84b2 alignfull"><div class="gb-inside-container"></div><div class="gb-shapes"><div class="gb-shape gb-shape-1"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" preserveAspectRatio="none"><defs/><path d="M0 224l6.2 5.3C12.3 235 25 245 37 224c12.2-21 25-75 37-90.7 12.2-16.3 24 5.7 37 5.4 12.1.3 24-21.7 37 0 12 21.3 24 85.3 37 96 11.9 10.3 24-31.7 37-48 11.8-15.7 24-5.7 36-21.4 12.8-16.3 25-58.3 37-64 12.7-5.3 25 26.7 37 64 12.6 37.7 25 79.7 37 80 12.5-.3 25-42.3 37-80C418.5 128 431 96 443 80c12.4-16 25-16 37-21.3 12.3-5.7 25-15.7 37 0 12.2 16.3 25 58.3 37 58.6 12.2-.3 24-42.3 37-64C603.1 32 615 32 628 26.7 640 21 652 11 665 48c11.9 37 24 123 37 170.7 11.8 48.3 24 58.3 36 42.6 12.8-16.3 25-58.3 37-90.6 12.7-31.7 25-53.7 37-48 12.6 5.3 25 37.3 37 26.6C861.5 139 874 85 886 96c12.5 11 25 85 37 101.3 12.4 15.7 25-26.3 37-32 12.3-5.3 25 26.7 37 37.4 12.2 10.3 25 .3 37 16 12.2 16.3 24 58.3 37 32 12.1-26.7 24-122.7 37-128 12-5.7 24 80.3 37 74.6 11.9-5.3 24-101.3 37-133.3 11.8-32 24 0 36 5.3 12.8 5.7 25-16.3 37-5.3 12.7 11 25 53 37 96 12.6 43 25 85 37 64 12.5-21 25-107 37-138.7 12.5-32.3 25-10.3 37 26.7 12.4 37 25 91 31 117.3l6 26.7v64H0z"/></svg></div></div></div>

No response? That’s a shame.

Yes, this seems like a bug to me too.

Steps I took

  1. Create a container and add a default GB shape
  2. View the page and copy the SVG HTML
  3. Paste the SVG HTML into the Asset Library
  4. Add a 2nd container and select the shape from the Asset Library

Result
preserveAspectRatio=“none” was stripped from the Asset Library SVG HTML

Expected behaviour
SVG HTML to be exactly the same for both shapes

Hi Jesse. Thanks for confirming.
@Tom would you like this to be reported? Through support, Github or is it noted already for a future fix?