Question

在其ID中具有变音符号且由use元素引用的SVG元素将不会显示在Chrome 63中。

Chrome 62（及之前的版本），Firefox 57和Edge正在正确显示SVG。

不会在Chrome 63中显示SVG的示例：

<svg id="TextBoxA" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events" version="1.1" viewBox="0 0 230 110" width="230" height="110"  encoding="UTF-8" >
	<defs>
		<g id="ThisIsAnUmlautä">
			<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" width="230" height="110" version="1.1">
				<path d="M0,0 h230 v110 l-230,0 z" fill="#444444"></path>
				<path d="M3,3 h224 v104 l-224,0 z" fill="#d13d73"></path>
				<text x="25" y="89" style="fill: #000000; stroke: none; font-size: 88px;">Aüöä</text>
			</svg>
		</g>
	</defs>
	<g>
		<use href="#ThisIsAnUmlautä" opacity="1"></use>
	</g>
</svg>

在id中没有变音符号的工作示例

<svg id="TextBoxA" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events" version="1.1" viewBox="0 0 230 110" width="230" height="110"  encoding="UTF-8" >
	<defs>
		<g id="ThisIsAnUmlaut">
			<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" width="230" height="110" version="1.1">
				<path d="M0,0 h230 v110 l-230,0 z" fill="#444444"></path>
				<path d="M3,3 h224 v104 l-224,0 z" fill="#d13d73"></path>
				<text x="25" y="89" style="fill: #000000; stroke: none; font-size: 88px;">Aüöä</text>
			</svg>
		</g>
	</defs>
	<g>
		<use href="#ThisIsAnUmlaut" opacity="1"></use>
	</g>
</svg>

错误报告：https://bugs.chromium.org/p/chromium/issues/detail?id=792848

问题

正如评论中所指出的，改变的意图可能只能由一位Chromium开发人员来回答。

知道变音符号是否完全被允许作为SVG ID（现在已确认答案：ISO table(s) of valid characters for SVG ids）会很有帮助。

所以现在有人知道除了移除变音符号之外是否有解决此问题的方法？

Answer 1

这显然是铬的一个错误。我的错误报告已合并到https://bugs.chromium.org/p/chromium/issues/detail?id=779420。

铬开发商表示此错误已经修复，将随Chrome 64一起发布。

在此之前，只有替代所有变音符号或完全避免使用变音符号的解决方法才有帮助。

Chrome 63 - 带有变音符号的SVG href标识符将不会显示

1 个答案: