Open feimosi opened 6 years ago
If you remove this block from [RoundProgressiveService]() does it still throw?:
this.supportsSvg = !!(
document &&
document.createElementNS &&
document.createElementNS('http://www.w3.org/2000/svg', 'svg').createSVGRect
);
Yes, still the same error.
Seems more like a problem with Angular Universal than with this component. I wonder if Angular Universal is attempting to schema check the template before it is compiled, so it's seeing things like getPathTransform()
and saying "HEY YAO - We don't know anything about this!".
I could also be that it just blows up for svg in general. If that's the case then any valid SVG like the goey spinner should blow it up. Could try replacing the template in the component with this:
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<defs>
<filter id="goo">
<feGaussianBlur in="SourceGraphic" stdDeviation="10" result="blur" />
<feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 21 -7"/>
</filter>
</defs>
</svg>
If the build works with that as the template then at least we are a little closer to knowing what's causing it. Could also try with bare svg like this:
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
</svg>
AFAIK that only happens when setting the xmlns
through a template. It's most likely throwing because of this instance in particular.
This demo runs in chrome with both the xmlns
and version
attributes removed from the svg
element. I can check on SO if they are required when declaring inline svg elements if need be.
So if you remove the xmlns
and version
attributes, does the build work?
Could try replacing the template in the component with this:
So if you remove the xmlns and version attributes, does the build work?
I've just tried the snippet from above and I can confirm:
xmlns
and version
it fails,The attributes are optional for inlined svg
so it should be fine to remove them.
This is a duplicate of https://github.com/angular/angular/issues/21196. It will be resolved with https://github.com/angular/angular/issues/22263
When using it with Angular Universal I get the following error on the server:
Enclosing the
<round-progress>
inside*ngIf="isPlatformBrowser"
doesn't help at all. This may be related: angular/material2#7866