<!DOCTYPE HTML>
<title>The "systemLanguage" match the langtag of which the user's preferred language is prefix </title>
<link rel="help" href="https://www.w3.org/TR/SVG2/struct.html#ConditionalProcessingSystemLanguageAttribute">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<svg id="mysvg">
</svg>
<script>
async function languageChange() {
return new Promise(resolve => window.onlanguagechange = resolve);
}
promise_test(async () => {
var languageChangePromise = languageChange();
testRunner.setAcceptLanguages("en");
await languageChangePromise;
var text1 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
text1.setAttribute('systemLanguage', 'en-US');
text1.textContent = 'English-US';
var mysvg = document.getElementById("mysvg");
mysvg.appendChild(text1);
assert_greater_than(text1.getBoundingClientRect().width, 0);
languageChangePromise = languageChange();
testRunner.setAcceptLanguages("it");
await languageChangePromise;
mysvg.removeChild(text1);
text1.setAttribute('systemLanguage', 'ita');
mysvg.appendChild(text1);
assert_equals(text1.getBoundingClientRect().width, 0);
});
</script>