<!doctype html>
<meta charset="utf-8">
<title>Link Element StyleSheet's title attribute</title>
<link rel="author" title="Takuya Kurimoto" href="mailto:[email protected]">
<link rel="help" href="https://drafts.csswg.org/cssom/#dom-stylesheet-title">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<link id="set_title" rel="stylesheet" href="null.css" type="text/css">
<link id="set_title" rel="stylesheet" title="" href="empty.css" type="text/css">
<link id="set_title" rel="stylesheet" title="title" href="set.css" type="text/css">
<link id="change_title_to_empty_string" rel="stylesheet" title="title" href="set.css" type="text/css">
<script>
test(function() {
const sheetCount = 3;
const sheets = Array.from(document.styleSheets).filter(sheet => sheet.ownerNode.id == 'set_title');
const linkStylesheets = Array.from(document.querySelectorAll('#set_title'));
assert_equals(sheets.length, sheetCount);
assert_equals(linkStylesheets.length, sheetCount);
for (let i = 0; i < sheets.length; ++i) {
let titleAttr = linkStylesheets[i].getAttribute("title");
if (titleAttr === null || titleAttr === "")
assert_equals(sheets[i].title, null, "Empty title returns null");
else
assert_equals(sheets[i].title, titleAttr, "Selected title is properly reflected");
}
}, "StyleSheet.title");
test(() => {
const linkStylesheet = document.getElementById('change_title_to_empty_string');
linkStylesheet.setAttribute("title", "")
const sheet = Array.from(document.styleSheets).find(sheet => sheet.ownerNode.id == 'change_title_to_empty_string');
assert_equals(sheet.title, null);
}, "Executing setAttribute('title', '') results in the title being set to null");
</script>