Saving SVGs with clip paths adds extra groups

New Here ,
May 19, 2022 May 19, 2022

Copy link to clipboard

Copied

When an AI file containing a shape (test.ai) with an image fill is exported as SVG (test.svg), a SVG group is created containing the shape's path with clipped sub-groups, defined using <defs>, containing the image. All well and good, apart from the fact that the shape's path is duplicated -- once in a <defs> element for clipping, once as the actual <path> -- and I suspect there's scope for optimisation.

If the saved SVG (test.svg) is resaved (as test1.svg) the groups above are wrapped in extraneous <g> elements -- one before each nested <defs> element, resulting in three additional nested groups. If test1.svg is saved again (as test2.svg) another three group elements are added.

Ongoing saving and opening a SVG eventually results in AI warning "There are too many nested groups than allowed in Illustrator. The file may not open correctly." and the shape's image fill is lost.

TOPICS
Bug

Views

229

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
May 23, 2022 May 23, 2022

Copy link to clipboard

Copied

Hi @David24526970hc9e,

 

We are sorry for the trouble. This was a known issue that came with Ai 26.2.1 while exporting SVG containing images. But I am glad to inform you that we have tried to address the issue in v26.3.1, released recently. Let us know if that works. 

 

Regards,

Anshul Saini

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 23, 2022 May 23, 2022

Copy link to clipboard

Copied

Hi Anshul,

Thanks for responding. Unfortunately the issue exists with AI 26.3.1,
this being the version I used in my testing. In fact I suspect the issue
predates AI 26.2.1 as we noticed image fills sometimes disappearing from
SVGs late last year -- this has now become more problematic for us,
hence my investigation as to why.


Best regards,
Dave

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
May 25, 2022 May 25, 2022

Copy link to clipboard

Copied

Thanks for sharing the details. You are correct. This issue started happening after v26.1 was released. The current workaround is to downgrade the app to v26.0.3 or older. We are targeting a July release to fix the issue, but it is possible to get delayed.

 

I hope this info helps!

 

Regards,

Anshul Saini

 

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 27, 2022 May 27, 2022

Copy link to clipboard

Copied

Hi Anshul,

 

I'm not sure how much testing you are doing, but v26.0.3 also has this bug. Hopefully it will be fixed in your July release; meanwhile we now have a Python script that removes the extraneous groups.

 

Regards,

Dave

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Jun 01, 2022 Jun 01, 2022

Copy link to clipboard

Copied

Hi @David24526970hc9e,

 

Glad to hear that you figured out a workaround. Would you mind confirming when this issue started happening and in which version of Illustrator? Also, did you try resetting preferences after downgrading to v26.0.3?

Also, this issue may be different from the one team is currently working on. There are multiple SVG bug fixes on which the team is working on currently. Would it be possible for you to share a screen recording demonstrating the issue, and I will share it with the engineering directly.

 

I will be looking forward to your response.

 

Thanks & Regards,

Anshul Saini

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 01, 2022 Jun 01, 2022

Copy link to clipboard

Copied

Hi Anshul,

 

I don't know when this started happening, nor what version of AI. We noticed image fills were disappearing last year; I investigated why AI was reporting "too many nested groups" just this May and then alerted yourselves as to the reason; following your suggestion to use v26.0.3, I tested that version and found it also contained the bug.

To replicate the issue:

  1. Open test.ai and save it as SVG, calling it `test.svg`.
  2. Close the SVG.
  3. Reopen the saved SVG.
  4. Use "File/Save As" to save it again, calling it `test1.svg`.
  5. Open both `test.svg` and `test1.svg` in a text editor and compare them.

    Best regards,

Dave

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Jun 02, 2022 Jun 02, 2022

Copy link to clipboard

Copied

Thanks, David, for sharing the reproducible steps. I see you are using the "save as" route to output the SVG file. Just want you to check one last thing.
Try the following methods to output the SVG files and share your observation with us:

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jun 02, 2022 Jun 02, 2022

Copy link to clipboard

Copied

Sorry Anshul, I have reported a bug in AI and clearly documented how to reproduce it. It is not up to me to investigate if the issue also occurs under different scenarios. This is a role for Adobe.

 

Thanks and regards,

Dave

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Jun 02, 2022 Jun 02, 2022

Copy link to clipboard

Copied

I understand that, @David24526970hc9e. I have already reported this to the concerned product team member. The steps I suggested above for you to check were more like other options to export SVG. I know you have created a python script that helps you remove the unwanted groups. But that's an additional step. However, if you try another export option from within Illustrator and it gives you the desired output, the extra steps will not be needed. It was not my intention for you to do the investigation on our behalf; I just wanted you to get better options and get your work done without doing any extra steps until this issue gets addressed.

 

Thanks & Regards,

Anshul Saini

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jun 02, 2022 Jun 02, 2022

Copy link to clipboard

Copied

Hi Anshul,

 

This issue is not to do with exporting illustrations as SVG. It is to do with opening SVG files for editing and then saving them.

 

Our workflow is to initially create an illustration in native AI format and, when it is subsequently complete, save it as SVG for use in downstream processing. Subsequent revisions are made (using Adobe Illustrator) to the SVG and saved using File/Save -- the original native AI document is discarded. Shapes with image fills have extraneous groups added each time the SVG is saved.

 

Regards,

Dave

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Jun 09, 2022 Jun 09, 2022

Copy link to clipboard

Copied

Thanks for sharing your workflow, @David24526970hc9e. I tested your workflow again, and the SVGs were similar when opened in notepad. Here is the Ai file, and please find attached the SVGs files below.

 

Were you getting the following error while opening SVGs with an image fill?

 

Anshul_Saini_0-1654795075298.png

 

If yes, please reset the Illustrator preferences and see if you see any difference.

 

Also, I am unable to access your test file to check and verify it at my end. Please reshare the file with public access.

Anshul_Saini_1-1654795251787.png

 

Looking forward to your response.

 

Regards,

Anshul Saini

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jun 09, 2022 Jun 09, 2022

Copy link to clipboard

Copied

Hi Anshul,

 

  1. I also get "Clipping will be lost on roundtrip to Tiny". It is a known issue with AI opening SVGs containing clip paths (search your support forum for details!).
  2. Your test SVGs do not contain clipped image fills, hence do not get additional SVG groups added when saved.
  3. The issue is about saving SVGs containing clip paths. You should be able to verify it by opening my `test.svg` (from above), saving it as an SVG under a different name, and then visually comparing the text of the two SVG files.
  4. My test file now has public access. This file is used to create the initial SVG but otherwise is not related to the issue.


Best regards, Dave.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Jun 13, 2022 Jun 13, 2022

Copy link to clipboard

Copied

Thanks for clarifying, @defaulttz5ld9symjzi. I have all the required information and was able to replicate the issue with your SVG file. I saved it using "Save As," and the groups in the layer panel increased. I checked this issue is replicable in all the versions of Illustrator CC.

However, in Illustrator v20, released in 2016, SVG format was added in "export as," which addressed many issues that "Save As" had.

 

I know your workflow doesn't include "export as," but I would suggest you try that. I used "export as" on your "Test.SVG," and instead of adding extra groups, it deleted the 3 groups from it.

 

I couldn't test your original Test.Ai as "Allow Save to Creative Cloud" is disabled for this file.

Anshul_Saini_1-1655151065913.png

I assume this file has only one group and if I save it using "export as," I will not get extra groups. But I understand "export as" might not be an option for you. So, I will be logging a bug with the Product team.

 

Thanks for your cooperation & time and for answering all my queries to understand the issue. I really appreciate it.

 

Regards,

Anshul Saini

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jun 13, 2022 Jun 13, 2022

Copy link to clipboard

Copied

Thank you Anshul for looking into this. Using "export as" is not an option for us, as my testing finds that amongst other things, "id" attributes are rewritten from those assigned in AI, and we use "id" for path annotatation. A quick search finds this issue, which indicates that this is a known issue.

Best regards,

Dave

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Jun 13, 2022 Jun 13, 2022

Copy link to clipboard

Copied

LATEST

Thanks for your testing and details info @defaulttz5ld9symjzi. For the other issue, it is a known Mar '22 bug that will be targeted for a fix in next month's release, and the current workaround for this specific issue is rolling back to v26.0.3, as mentioned & confirmed by other users as well on UserVoice, community, and Adobe chat support.

 

Regards,

Anshul Saini

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines