Illustrator does not understand SVG masks

[Karl Fabian5F97]

Hello!

I am having issues with importing SVGs into illustrator. Essentially, it appears that illustrator tries to simplify the SVG into path components but does not properly account for masks upon doing so. Here is what my SVG looks like when opened in a browser:

Notice how the hair of the woman goes on top of the body and as such hides (masks) that part of the body. However, when I open this exact file in illustrator it looks like this:

Notice how in this case the portions of the body behind the hair are visible, essentially the masks are not applied properly. 

I have noticed that it seems like the "ClipMask" property of SVGs work better when importing into illustrator. However, I would very much appreciate if anyone could provide any insight. Basically my question is how I can make sure that illustrator regonizes these masks properly as all other tools do, or what I can replace the masks with so that Illustrator can interpret them properly.

It would also be great if Adobe could update Illustrator so as to include this functionality. 

Find attached the SVG before and after importing into illustrator. 

Thank you community!

[Monika Gause]

I don't see a difference between those images. Please mark it in your screenshots.

[Karl Fabian5F97]

Sorry, I uploaded the SVGs directly rather than screenshotting them. I can add red circles but if you look at the hair endings, right where the hair goes over the womans' shoulders, you can see how in one image the hair "covers" the body, whereas in the first image it does not.

[Monika Gause]

I'd rather have that pointed out than having to search for it and misunderstanding you. Thank you.

[Anshul_Saini · Accepted solution]

Hi there,

Thank you for reaching out. Point taken! I will forward this feedback to the Product team. I would suggest if you could also post it here (https://illustrator.uservoice.com/). This way, you will keep getting all the updates related to this functionality, and other users can also upvote, which would help us prioritize. Also, could you please tell us in which application this SVG was created?

Regards,

Anshul Saini

[Karl Fabian5F97]

Thank you for the answer. I will add this discussion to the link you posted.

The SVG was created in a natively-built environment in the company where I work. The library used is called svg.js and it is used in a node.js back-end. This is the link to their library: https://svgjs.dev/docs/3.0/

[Anshul_Saini]

Thank you for sharing the details. Please feel free to reach out if you run into any other questions or issues in the future. We'd be happy to help.

Regards,

Anshul Saini