<!doctype html>
<html>
<head>
<script src="../../resources/js-test-pre.js"></script>
<style id="style-container">
</style>
</head>
<body>
</body>
<script>
description('Test the parsing of :not(selectorList) for querySelector and style.');

function testInvalidSelector(selectorString) {
    var styleContainer = document.getElementById('style-container');
    styleContainer.innerHTML = ':not(' + selectorString + ') { }';
    const parsed = document.getElementById('style-container').sheet.cssRules.length == 1;
    debug(`selector '${styleContainer.innerHTML}' parsed: ${parsed ? "YES" : "NO"}`);
    styleContainer.innerHTML = '';
}

var invalidSelectors = [
    // Pseudo elements.
    "::first-letter",
    "::first-line",
    "::before",
    "::after",
    ":first-letter",
    ":first-line",
    ":before",
    ":after",

    // Not selectors.
    "",
    "    ",
    ",",

    ".123class",
    "#123id",
    "[]",
    "()",
    ")",
    "{}",
    "}",

    // Empty functional pseudo classes.
    ":not()",
    ":is()",
    ":matches()",
    ":nth-child()",
    ":nth-child(2n of)",

    // Unbalanced parenthesized functional pseudo classes.
    ":not(",
    ":is(",
    ":matches(",
    ":nth-child(2n+1 of",
];

debug("1 invalid selectors");
for (var i = 0; i < invalidSelectors.length; ++i) {
    var selectorString = invalidSelectors[i];
    testInvalidSelector(selectorString);
}

</script>
<script src="../../resources/js-test-post.js"></script>
</html>