From 72e1e4d8e683eb437ce29d788037beafff10a53b Mon Sep 17 00:00:00 2001 From: Luke Warlow Date: Tue, 23 Jan 2024 15:11:59 +0000 Subject: [PATCH] Stringify input in Process value with a default policy (#417) SHA: 4f94c5b4d972d254014759bafb0f220cf12559d0 Reason: push, by koto Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- dist/spec/index.html | 4580 +++++++++++++++++++++--------------------- 1 file changed, 2245 insertions(+), 2335 deletions(-) diff --git a/dist/spec/index.html b/dist/spec/index.html index 0ed0e20..af6efc5 100644 --- a/dist/spec/index.html +++ b/dist/spec/index.html @@ -5,12 +5,10 @@ Trusted Types - - - - - - + - + - + - + - - - + + - + - +

Trusted Types

-

Editor’s Draft,

+

Editor’s Draft,

More details about this document
This version: -
https://w3c.github.io/webappsec-trusted-types/dist/spec/ +
https://w3c.github.io/trusted-types/dist/spec/
Feedback:
public-webappsec@w3.org with subject line “[trusted-types] … message topic …” (archives)
Issue Tracking: -
GitHub +
GitHub
Inline In Spec
Editor:
(Google LLC)
Former Editor:
(Google LLC) +
Test Suite: +
https://wpt.fyi/results/trusted-types/
- +
@@ -681,7 +1053,7 @@

public list of any patent disclosures made in connection with the deliverables of the group; that page also includes instructions for disclosing a patent. An individual who has actual knowledge of a patent which the individual believes contains Essential Claim(s) must disclose the information in accordance with section 6 of the W3C Patent Policy.

-

This document is governed by the 2 November 2021 W3C Process Document.

+

This document is governed by the 03 November 2023 W3C Process Document.

@@ -701,8 +1073,7 @@

Table of Contents

  • 2.1 Injection sinks
      -
    1. 2.1.1 HTML injection sinks -
    2. 2.1.2 DOM XSS injection sinks +
    3. 2.1.1 DOM XSS injection sinks
  • 2.2 Trusted Types @@ -822,6 +1193,98 @@

    Table of Contents

    +
    + Tests + +

    1. Introduction

    This section is not normative.

    Certain classes of vulnerabilities occur when a web application @@ -840,7 +1303,7 @@

    foo and bar.

    This document focuses on preventing DOM-Based Cross-Site Scripting -that occurs when attacker-controlled data reaches § 2.1.2 DOM XSS injection sinks, as that eventually causes execution of the +that occurs when attacker-controlled data reaches § 2.1.1 DOM XSS injection sinks, as that eventually causes execution of the script payload controlled by the attacker. DOM XSS is prevalent in the web applications as there are over 60 different injection sinks (e.g. Element.innerHTML, or Location.href setters).

    @@ -864,7 +1327,7 @@

    1.1.

    Reduce security review surface for complex web application codebases.

  • -

    Allow the detection of vulnerabilities similar to how regular +

    Allow the usability-preserving detection of vulnerabilities similar to how regular programming errors are detected and surfaced to the developers, with the assist of dynamic and static analysis tools.

    @@ -874,10 +1337,10 @@

    Prevent, or mitigate the result of injections into server-side generated markup, in specific reflections into the body of the scripts running in a document. To address server-side XSS vectors, we recommend existing -solutions like templating systems or CSP script-src.

    +solutions like templating systems or CSP script-src.

  • Address resource confinement, e.g. to prevent data exfiltration, or -connecting to external sources via [Fetch].

    +connecting to external sources via [Fetch].

  • Control subresource loading. Trusted Types aim to allow the authors to control loading resources that can script the current document, but not @@ -900,7 +1363,15 @@

    libraries that perform auxiliary tasks (e.g. analytics, performance monitoring). To ensure that none of these components introduce DOM XSS vulnerabilities, author defines a Trusted Type policy in the -templating library and enables the enforcement for the § 2.1.2 DOM XSS injection sinks.

    +templating library and enables the enforcement for the § 2.1.1 DOM XSS injection sinks.

    +
  • +

    A website uses § 2.1.1 DOM XSS injection sinks. The website-developer adds trusted +types to it and monitors violations by using the Content-Security-Policy-Report-Only header field. +Violations are iteratively fixed by refactoring the code to use only safe +methods. Afterwards, no § 2.1.1 DOM XSS injection sinks are called anymore. +Hence, no trusted types are required anymore. The developer switches the +report-only mode off and disables trusted type policies with the trusted-types and the require-trusted-types-for directives. +The website’s functionality was never impaired during the refactorings.

  • A large team maintains a complex client-side application. They create a number of Trusted Types policies that satisfy the security @@ -911,14 +1382,14 @@

    The need to create trusted values to affect injection sinks, combined with additional scrutiny on changes that affect policy code, incents developers to use safe abstractions instead of writing ad-hoc -string composition code when interacting with § 2.1.2 DOM XSS injection sinks.

    +string composition code when interacting with § 2.1.1 DOM XSS injection sinks.

    When considering the risk of DOM XSS, security auditors find a small attack surface; they focus on the small amount of code that crafts the CSP header and provides the safe abstractions, and ignore the bulk of client-side application code.

  • An existing web application interacts with the DOM mostly using XSS-safe -patterns (i.e. without using § 2.1.2 DOM XSS injection sinks). In a few places, +patterns (i.e. without using § 2.1.1 DOM XSS injection sinks). In a few places, however, it resorts to using risky patterns like loading additional script using JSONP, calling into innerHTML or eval.

    Review finds that those places do not cause XSS (e.g. because @@ -950,7 +1421,7 @@

    Note: The exact list of injection sinks covered by this document is defined in § 4 Integrations.

    +

    Note: The exact list of injection sinks covered by this document is defined in § 4 Integrations.

    It’s difficult to determine if a given application contains such a vulnerability (e.g. if it is vulnerable to DOM XSS) only by analyzing the invocations of injection sinks, as their inputs (usually strings) @@ -961,25 +1432,11 @@

    Enforcement for groups is controlled via trusted-types-sink-group values.

    -

    2.1.1. HTML injection sinks

    -

    This section is not normative.

    -

    HTML injection sinks parse input strings into a DOM tree. Since HTML parsers -can create arbitrary elements, including scripts, and set arbitrary attributes, -enabling the enforcement of any trusted-types-sink-group also implies -enforcing types for HTML injection sinks.

    -

    Examples of HTML injection sinks include:

    - -

    2.1.2. DOM XSS injection sinks

    +

    2.1.1. DOM XSS injection sinks

    This section is not normative.

    -

    DOM XSS injection sinks evaluate an input string value in a way that could +

    DOM XSS injection sinks evaluate an input string value in a way that could result in DOM XSS if that value is untrusted.

    -

    Examples of include:

    +

    Examples include:

    • Setters for Element attributes that accept a URL of the code to load @@ -991,47 +1448,40 @@

      Navigation to 'javascript:' URLs.

    -

    Guarding DOM XSS injection sinks is controlled by the trusted-types-sink-group named 'script'.

    +

    Since HTML parsers can create arbitrary elements, including scripts, and set arbitrary attributes, +DOM XSS injection sinks also include HTML parsing sinks:

    + +

    Guarding DOM XSS injection sinks is controlled by the trusted-types-sink-group named 'script'.

    2.2. Trusted Types

    To allow the authors to control values reaching injection sinks, we introduce § 2.2 Trusted Types. The following list of Trusted Types indicating that a given value is trusted by the authors to be used with an injection sink in a certain context.

    -

    Note: Trusted in this context signifies the fact that the application author +

    Note: Trusted in this context signifies the fact that the application author is confident that a given value can be safely used with an injection sink - she trusts it does not introduce a vulnerability. That does not imply that the value is indeed safe.

    -

    Note: This allows the authors to specify the intention when creating a given +

    Note: This allows the authors to specify the intention when creating a given value, and the user agents to introduce checks based on the type of such value to preserve the authors' intent. For example, if authors intend a value to be used as an HTML snippet, an attempt to load a script from that value would fail.

    -

    Note: All Trusted Types wrap over an immutable string, specified when the +

    Note: All Trusted Types wrap over an immutable string, specified when the objects are created. These objects are unforgeable in a sense that there is no JavaScript-exposed way to replace the inner string value of a given object - it’s stored in an internal slot with no setter exposed.

    -

    Note: All Trusted Types stringifiers return the inner string value. +

    Note: All Trusted Types stringifiers return the inner string value. This makes it easy to incrementally migrate the application code into using Trusted Types in place of DOM strings (it’s possible to start producing types in parts of the application, while still using and accepting strings in other parts of the codebase). In that sense, Trusted Types are backwards-compatible with the regular DOM APIs.

    2.2.1. TrustedHTML

    -
    - -
    -

    TrustedHTML

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -

    The TrustedHTML interface represents a string that a developer can confidently insert into an injection sink that will render it as HTML. These objects are immutable @@ -1046,56 +1496,11 @@

    - -
    -

    TrustedHTML/toJSON

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome90+ -
    - Opera?Edge90+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    TrustedHTML/toString

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -

    toJSON() method steps and the stringification behavior steps of a TrustedHTML object are to return the value from its [[Data]] internal slot.

    The fromLiteral(object templateStringsArray) method, when invoked, returns the result of executing a Create a Trusted Type from literal algorithm, with TrustedHTML as type and templateStringsArray as template.

    2.2.2. TrustedScript

    -
    - -
    -

    TrustedScript

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -

    The TrustedScript interface represents a string with an uncompiled script body that a developer can confidently pass into an injection sink that might lead to executing that script. These objects are immutable wrappers @@ -1110,43 +1515,11 @@

    - -
    -

    TrustedScript/toJSON

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome90+ -
    - Opera?Edge90+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -

    toJSON() method steps and the stringification behavior steps of a TrustedScript object are to return the value from its [[Data]] internal slot.

    The fromLiteral(object templateStringsArray) method, when invoked, returns the result of executing a Create a Trusted Type from literal algorithm, with TrustedScript as type and templateStringsArray as template.

    2.2.3. TrustedScriptURL

    -
    - -
    -

    TrustedScriptURL

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -

    The TrustedScriptURL interface represents a string that a developer can confidently pass into an injection sink that will parse it as a URL of an external script resource. @@ -1162,48 +1535,6 @@

    TrustedScriptURL objects have a [[Data]] internal slot which holds a USVString. The slot’s value is set when the object is created, and will never change during its lifetime.

    -
    - -
    -

    TrustedScript/toString

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    TrustedScriptURL/toString

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    TrustedScriptURL/toJSON

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome90+ -
    - Opera?Edge90+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -

    toJSON() method steps and the stringification behavior steps of a TrustedScriptURL object are to return the value from its [[Data]] internal slot.

    The fromLiteral(object templateStringsArray) method, when invoked, returns the result of executing a Create a Trusted Type from literal algorithm, @@ -1228,7 +1559,7 @@

    Note: Trusted Type objects wrap values that are explicitly trusted by +

    Note: Trusted Type objects wrap values that are explicitly trusted by the author. As such, creating a Trusted Type object instance becomes a de facto injection sink, and hence code that creates a Trusted Type instances is security-critical. To allow for strict control over Trusted Type @@ -1253,18 +1584,18 @@

    Note: Trusted Type objects can only be created via policies. If enforcement is enabled, only the policy code can trigger an action +

    Note: Trusted Type objects can only be created via policies. If enforcement is enabled, only the policy code can trigger an action of an injection sink and hence call-sites of the policies' create* functions are the only security-sensitive code in the entire program with regards to the actions of the injection sinks. Only this typically small subset of the entire code base needs to be security-reviewed - there’s no need to monitor or review -the injection sinks themselves, as User Agents enforce that +the injection sinks themselves, as User Agents enforce that those sinks will only accept matching Trusted Type objects, and these in turn can only be created via policies.

    The createPolicy function returns a policy object which create* functions will create Trusted Type objects after applying the policy rules.

    -

    Note: While it’s safe to freely use a policy that sanitizes its input anywhere in the application, +

    Note: While it’s safe to freely use a policy that sanitizes its input anywhere in the application, there might be a need to create lax policies to be used internally, and only to be called with author-controlled input. For example, a client-side HTML templating library, an HTML sanitizer library, or a JS asynchronous @@ -1288,25 +1619,9 @@

    2.3.1. TrustedTypePolicyFactory

    -
    - -
    -

    TrustedTypePolicyFactory

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -

    TrustedTypePolicyFactory creates policies and verifies that Trusted Type object instances were created via one of the policies.

    -

    Note: This factory object is exposed to JavaScript through trustedTypes property +

    Note: This factory object is exposed to JavaScript through trustedTypes property on the global object - see § 4.3.1 Extensions to the WindowOrWorkerGlobalScope interface.

    [Exposed=(Window,Worker)] interface TrustedTypePolicyFactory {
         TrustedTypePolicy createPolicy(
    @@ -1334,29 +1649,12 @@ 

    initially empty.

    -
    -
    - -
    -

    TrustedTypePolicyFactory/createPolicy

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    createPolicy(policyName, policyOptions)

    +
    createPolicy(policyName, policyOptions)

    Creates a policy object that will implement the rules passed in the TrustedTypePolicyOptions policyOptions object. The allowed policy names may be restricted by Content Security Policy. -If the policy name is not on the allowlist defined in the trusted-types CSP directive, +If the policy name is not on the allowlist defined in the trusted-types CSP directive, the policy creation fails with a TypeError. Also, if unique policy names are enforced (i.e. 'allow-duplicates' is not used), and createPolicy is called more than once with any given policyName, @@ -1401,29 +1699,12 @@

    'https://scripts.myapp.example/script.js');

    -
    -
    - -
    -

    TrustedTypePolicyFactory/isHTML

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    isHTML(value)

    +
    isHTML(value)

    Returns true if value is an instance of TrustedHTML and has its [[Data]] internal slot set, false otherwise.

    -

    Note: is* functions are used to check if a given object is truly a legitimate Trusted Type object (i.e. it was created via one of the configured +

    Note: is* functions are used to check if a given object is truly a legitimate Trusted Type object (i.e. it was created via one of the configured policies). This is to be able to detect a forgery of the objects via -e.g. Object.create or prototype chains manipulation.

    +e.g. Object.create or prototype chains manipulation.

    const html = policy.createHTML('<div>');
    @@ -1435,64 +1716,13 @@ 

    trustedTypes.isHTML("<div>plain string</div>"); // false

    -
    -
    - -
    -

    TrustedTypePolicyFactory/isScript

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    isScript(value)

    +
    isScript(value)

    Returns true if value is an instance of TrustedScript and has its [[Data]] internal slot set, false otherwise.

    -
    -
    - -
    -

    TrustedTypePolicyFactory/isScriptURL

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    isScriptURL(value)

    +
    isScriptURL(value)

    Returns true if value is an instance of TrustedScriptURL and has its [[Data]] internal slot set, false otherwise.

    -
    -
    - -
    -

    TrustedTypePolicyFactory/getPropertyType

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    getPropertyType(tagName, property, elementNs)

    +
    getPropertyType(tagName, property, elementNs)

    Allows the authors to check if a Trusted Type is required for a given Element's property (IDL attribute).

    @@ -1507,7 +1737,7 @@

  • If interface has an IDL attribute member which identifier is attribute, and StringContext IDL extended attribute appears on that attribute, return stringified StringContext's identifier and abort further steps.

    -

    Note: This also takes into account all members of interface mixins that interface includes.

    +

    Note: This also takes into account all members of interface mixins that interface includes.

  • Return null.

    @@ -1517,24 +1747,7 @@

    trustedTypes.getPropertyType('foo', 'bar'); // null -
    -
    - -
    -

    TrustedTypePolicyFactory/getAttributeType

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    getAttributeType(tagName, attribute, elementNs, attrNs)

    +
    getAttributeType(tagName, attribute, elementNs, attrNs)

    Allows the authors to check if, (and if so, which) Trusted Type is required for a given Element's content attribute, such that later on the call @@ -1570,24 +1783,7 @@

    -
    -
    - -
    -

    TrustedTypePolicyFactory/emptyHTML

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    emptyHTML, of type TrustedHTML, readonly

    +
    emptyHTML, of type TrustedHTML, readonly

    is a TrustedHTML object with its [[Data]] internal slot value set to an empty string.

    @@ -1597,28 +1793,11 @@

    -
    -
    - -
    -

    TrustedTypePolicyFactory/emptyScript

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    emptyScript, of type TrustedScript, readonly

    +
    emptyScript, of type TrustedScript, readonly

    is a TrustedScript object with its [[Data]] internal slot value set to an empty string.

    -

    Note: This object can be used to detect if the runtime environment has § 4.9.6 Support for dynamic code compilation. While native Trusted Types implementation can +

    Note: This object can be used to detect if the runtime environment has § 4.9.6 Support for dynamic code compilation. While native Trusted Types implementation can support eval(TrustedScript), it is impossible for a polyfill to emulate that, as eval(TrustedScript) will return its input without unwrapping and evaluating the code.

    @@ -1631,24 +1810,7 @@

    -
    -
    - -
    -

    TrustedTypePolicyFactory/defaultPolicy

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    defaultPolicy, of type TrustedTypePolicy, readonly, nullable

    +
    defaultPolicy, of type TrustedTypePolicy, readonly, nullable

    Returns the value of [[DefaultPolicy]] internal slot, or null if the slot is empty.

    @@ -1661,42 +1823,10 @@

    2.3.2. TrustedTypePolicy

    -
    - -
    -

    TrustedTypePolicy

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -

    Policy objects implement a TrustedTypePolicy interface and define a group of functions creating Trusted Type objects. Each of the create* functions converts a string value to a given Trusted Type variant, or throws a TypeError if a conversion of a given value is disallowed.

    -
    - -
    -

    TrustedTypePolicy/name

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    [Exposed=(Window,Worker)]
     interface TrustedTypePolicy {
       readonly attribute DOMString name;
    @@ -1709,24 +1839,7 @@ 

    Each TrustedTypePolicy object has an [[options]] internal slot, holding the TrustedTypePolicyOptions object describing the actual behavior of the policy.

    -
    -
    - -
    -

    TrustedTypePolicy/createHTML

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    createHTML(input, ...arguments)

    +
    createHTML(input, ...arguments)

    Returns the result of executing the Create a Trusted Type algorithm, with the @@ -1741,24 +1854,7 @@

    arguments
    arguments

    -
    -
    - -
    -

    TrustedTypePolicy/createScript

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    createScript(input, ...arguments)

    +
    createScript(input, ...arguments)

    Returns the result of executing the Create a Trusted Type algorithm, with the @@ -1773,24 +1869,7 @@

    arguments
    arguments -
    -
    - -
    -

    TrustedTypePolicy/createScriptURL

    -

    In only one current engine.

    -
    - FirefoxNoneSafariNoneChrome83+ -
    - Opera?Edge83+ -
    - Edge (Legacy)?IENone -
    - Firefox for Android?iOS Safari?Chrome for Android?Android WebView?Samsung Internet?Opera Mobile? -
    -
    -
    -

    createScriptURL(input, ...arguments)

    +
    createScriptURL(input, ...arguments)

    Returns the result of executing the Create a Trusted Type algorithm, with the @@ -1811,13 +1890,13 @@

    This dictionary holds author-defined functions for converting string values into trusted values. These functions do not create Trusted Type object instances directly - this behavior is provided by TrustedTypePolicy.

    dictionary TrustedTypePolicyOptions {
    -   CreateHTMLCallback? createHTML;
    -   CreateScriptCallback? createScript;
    -   CreateScriptURLCallback? createScriptURL;
    +   CreateHTMLCallback createHTML;
    +   CreateScriptCallback createScript;
    +   CreateScriptURLCallback createScriptURL;
     };
    -callback CreateHTMLCallback = DOMString (DOMString input, any... arguments);
    -callback CreateScriptCallback = DOMString (DOMString input, any... arguments);
    -callback CreateScriptURLCallback = USVString (DOMString input, any... arguments);
    +callback CreateHTMLCallback = DOMString? (DOMString input, any... arguments);
    +callback CreateScriptCallback = DOMString? (DOMString input, any... arguments);
    +callback CreateScriptURLCallback = USVString? (DOMString input, any... arguments);
     

    2.3.4. Default policy

    This section is not normative.

    @@ -1836,7 +1915,7 @@

    null or undefined, it will cause a CSP violation. In the enforcing mode, an error will be thrown, but in report-only the original value passed to the default policy will be used.

    -

    Note: This optional behavior allows for introducing Trusted Type enforcement to applications that are still using legacy code that uses injection sinks. +

    Note: This optional behavior allows for introducing Trusted Type enforcement to applications that are still using legacy code that uses injection sinks. Needless to say, this policy should necessarily be defined with very strict rules not to bypass the security restrictions in unknown parts of the application. In an extreme @@ -1845,7 +1924,7 @@

    -

    Note: See § 3.5 Get Trusted Type compliant string for details on how +

    Note: See § 3.5 Get Trusted Type compliant string for details on how the default policy is applied.

    @@ -1866,7 +1945,7 @@

    2.4. Enforcement

    -

    Note: Enforcement is the process of checking that a value +

    Note: Enforcement is the process of checking that a value has an appropriate type before it reaches an injection sink.

    The JavaScript API that allows authors to create policies and Trusted Types objects from them is always available (via trustedTypes). Since injection sinks stringify their security sensitive @@ -1878,10 +1957,10 @@

    policies by specifying rules around policy creation.

    2.4.1. Content Security Policy

    Applications may control Trusted Type enforcement via configuring a Content Security Policy. This document defines new directives that correspond to Trusted Types rules. -The require-trusted-types-for directive specifies the injection sinks groups, for which the types should be required. The trusted-types directive controls how policies can be created.

    -

    Note: Using CSP mechanisms allows the authors to prepare their application for enforcing Trusted Types -via using the Content-Security-Policy-Report-Only HTTP Response header.

    -

    Note: Most of the enforcement rules are defined as modifications of the +The require-trusted-types-for directive specifies the injection sinks groups, for which the types should be required. The trusted-types directive controls how policies can be created.

    +

    Note: Using CSP mechanisms allows the authors to prepare their application for enforcing Trusted Types +via using the Content-Security-Policy-Report-Only HTTP Response header.

    +

    Note: Most of the enforcement rules are defined as modifications of the algorithms in other specifications, see § 4 Integrations.

    3. Algorithms

    3.1. Create a Trusted Type Policy

    @@ -1947,12 +2026,10 @@

    callback **this** value set to null.

    -
  • -

    If policyValue is an error, return policyValue and abort the following steps.

    +and callback **this** value set to null, rethrowing any exceptions.

  • If policy’s name is "default" and the policyValue is null or undefined, return policyValue.

    -

    Note: This is used in a Get Trusted Type compliant string algorithm to signal that +

    Note: This is used in a Get Trusted Type compliant string algorithm to signal that a value was rejected.

  • Let dataString be the result of stringifying policyValue.

    @@ -1962,7 +2039,7 @@

    TrustedScript, set its [[HostDefinedCodeLike]] internal slot value to the value in its [[Data]] slot.

    -

    Note: This adds an integration point with dynamic-code-brand-checks proposal.

    +

    Note: This adds an integration point with dynamic-code-brand-checks proposal.

  • Return trustedObject.

    @@ -1979,7 +2056,7 @@

    TrustedHTML, perform the following steps:

    1. -

      Let templateNode be the results of creating an element given "template", the HTML namespace and current global object's associated Document.

      +

      Let templateNode be the results of creating an element given "template", the HTML namespace and current global object's associated Document.

    2. Assert: templateNode is HTMLTemplateElement.

    3. @@ -2002,14 +2079,14 @@

    3.5. Get Trusted Type compliant string

    This algorithm will return a string that can be used with an injection sink, optionally unwrapping it from a matching Trusted Type. -It will ensure that the Trusted Type enforcement rules were respected.

    +It will ensure that the Trusted Type enforcement rules were respected.

    Given a TrustedType type (expectedType), a global object (global), TrustedType or a string (input), a string (sink) and a string (sinkGroup), run these steps:

    1. Let cspList be the global’s CSP list.

    2. If cspList is null or does not contain a policy which directive set containing a directive with a name "require-trusted-types-for", -or that directive does not contain a trusted-types-sink-group which is a match for a value sinkGroup, +or that directive does not contain a trusted-types-sink-group which is a match for a value sinkGroup, return stringified input and abort these steps.

    3. If input has type expectedType, return stringified input and abort these steps.

      @@ -2025,7 +2102,7 @@

      Note: This step assures that the default policy rejection will be reported, but ignored in a report-only mode.

      +

      Note: This step assures that the default policy rejection will be reported, but ignored in a report-only mode.

    4. Throw a TypeError and abort further steps.

    @@ -2047,7 +2124,7 @@

    regular operation argument that the type annotated with the [StringContext] extended attribute appears in is its related construct.

    A type that is not DOMString or USVString must not be associated with the [StringContext] extended attribute.

    -

    See the rules for converting ECMAScript values to the IDL types in Web IDL § 3.2.10 DOMString for the specific requirements that the use of [StringContext] entails.

    +

    See the rules for converting ECMAScript values to the IDL types in Web IDL § 3.2.10 DOMString for the specific requirements that the use of [StringContext] entails.

    In the following IDL fragment, a variadic operation is declared that uses the [StringContext] extended attribute on all its arguments:

    interface Document {
    -  undefined write([StringContext=html] DOMString... text);
    +  undefined write([StringContext=TrustedHTML] DOMString... text);
     };
     
    @@ -2138,14 +2215,14 @@

    < [LegacyNullToEmptyString].

    4.2.2. Type conversion

    -

    This specification modifies the algorithm implementing the conversion to DOMString in Web IDL § 3.2.10 DOMString:

    +

    This specification modifies the algorithm implementing the conversion to DOMString in Web IDL § 3.2.10 DOMString:

    An ECMAScript value V is converted to an IDL DOMString value by running the following algorithm:

    1. If the conversion is to an IDL type associated with the [StringContext] extended attribute, then set V to the result of validate the string in context, passing this, V, the StringContext extended attribute identifier, and the identifier of the [StringContext] extended attribute related construct. -

      Note: That algorithm may throw a TypeError.

      +

      Note: That algorithm may throw a TypeError.

    2. If V is null and the conversion is to an IDL type @@ -2157,8 +2234,8 @@

      Return the IDL DOMString value that represents the same sequence of code units as the one the ECMAScript String value x represents.

    4.2.3. Validate the string in context

    -

    This specification adds a following section to Web IDL § 3.5 Security.

    -

    Certain algorithms in Web IDL § 3.2 ECMAScript type mapping are defined to validate the string in context on a given +

    This specification adds a following section to Web IDL § 3.5 Security.

    +

    Certain algorithms in Web IDL § 3.2 JavaScript type mapping are defined to validate the string in context on a given value. This check is used to determine whether a given value is appropriate for its StringContext. This validation takes the following four inputs:

      @@ -2173,12 +2250,12 @@

    The algorithm returns an ECMAScript String value, or throws a TypeError.

    -

    Note: The HTML Standard defines how the validation is performed. [HTML]

    +

    Note: The HTML Standard defines how the validation is performed. [HTML]

    4.3. Integration with HTML

    -

    Window and Worker objects have a trusted type policy factory, +

    Window and Worker objects have a trusted type policy factory, which is a TrustedTypePolicyFactory object.

    4.3.1. Extensions to the WindowOrWorkerGlobalScope interface

    -

    This document extends the WindowOrWorkerGlobalScope interface defined by HTML:

    +

    This document extends the WindowOrWorkerGlobalScope interface defined by HTML:

    partial interface mixin WindowOrWorkerGlobalScope {
       readonly attribute TrustedTypePolicyFactory trustedTypes;
     };
    @@ -2186,8 +2263,8 @@ 

    trustedTypes getter steps are to return this's relevant global object's trusted type policy factory.

    4.3.2. Extensions to the Document interface

    -

    This document modifies the Document interface defined by HTML:

    -
    partial interface Document {
    +   

    This document modifies the Document interface defined by HTML:

    +
    partial interface Document {
       [CEReactions] undefined write(HTMLString... text);
       [CEReactions] undefined writeln(HTMLString... text);
     };
    @@ -2210,17 +2287,29 @@ 
    This document modifies how HTMLScriptElement child text content can be set to allow applications to control dynamically created scripts. It does so by adding the innerText and textContent attributes directly on HTMLScriptElement. The behavior of the attributes remains the same as in their original counterparts, apart from additional behavior triggered by the StringContext extended attribute presence.

    -

    Note: Using these IDL attributes is the recommended way of dynamically setting URL or a text of a script. Manipulating attribute nodes or text nodes directly will call a default policy on the final value when the script is prepared.

    +

    Note: Using these IDL attributes is the recommended way of dynamically setting URL or a text of a script. Manipulating attribute nodes or text nodes directly will call a default policy on the final value when the script is prepared.

    Figure out what to do with script.setAttribute('src'). See DOM#789.

    -
    partial interface HTMLScriptElement {
    +
    partial interface HTMLScriptElement {
      [CEReactions] attribute [LegacyNullToEmptyString] ScriptString innerText;
      [CEReactions] attribute ScriptString? textContent;
      [CEReactions] attribute ScriptURLString src;
      [CEReactions] attribute ScriptString text;
     };
     
    -

    On setting, the innerText, textContent and text IDL attributes perform the regular steps, and then set [[ScriptText]] internal slot value with the stringified value.

    -

    On setting, the src IDL attribute performs the usual steps, and then sets [[ScriptURL]] internal slot value to its src content attribute value.

    +

    On setting the innerText, textContent and text IDL attributes execute the following algorithm:

    +
      +
    1. +

      Set [[ScriptText]] internal slot value to the stringified attribute value.

      +
    2. +

      Perform the usual attribute setter steps.

      +
    +

    On setting the src IDL attribute, execute the following algorithm:

    +
      +
    1. +

      Set [[ScriptURL]] internal slot value to the stringified attribute value.

      +
    2. +

      Perform the usual attribute setter steps.

      +
    4.3.3.3. Slot value verification

    The first few steps of the prepare the script element algorithm are modified as follows:

      @@ -2274,7 +2363,7 @@

      4.3.4. Enforcement in element attributes

      This document modifies following IDL attributes of various DOM elements:

      -
      partial interface HTMLIFrameElement {
      +
      partial interface HTMLIFrameElement {
         [CEReactions] attribute HTMLString srcdoc;
       };
       
      @@ -2289,7 +2378,7 @@ 

      4.3.5. Enforcement in timer functions

      This document modifies the WindowOrWorkerGlobalScope interface mixin:

      -
      typedef (ScriptString or Function) TrustedTimerHandler;
      +
      typedef (ScriptString or Function) TrustedTimerHandler;
       
       partial interface mixin WindowOrWorkerGlobalScope {
         long setTimeout(TrustedTimerHandler handler, optional long timeout = 0, any... arguments);
      @@ -2313,10 +2402,10 @@ 

      Note: This matches the logic that the extended attribute would apply.

      +

      Note: This matches the logic that the extended attribute would apply.

    -

    Note: This makes sure that a TrustedScript is passed to timer +

    Note: This makes sure that a TrustedScript is passed to timer functions in place of a string when Trusted Types are enforced, but also unconditionally accepts any Function object.

    4.3.6. Enforcement in event handler content attributes

    @@ -2334,14 +2423,14 @@
  • @@ -2910,7 +2976,7 @@

    [RFC2119]

    + except sections explicitly marked as non-normative, examples, and notes. [RFC2119]

    Examples in this specification are introduced with the words “for example” or are set apart from the normative text with class="example", @@ -2924,20 +2990,30 @@

    , like this:

    Note, this is an informative note.

    -

    Conformant Algorithms

    -

    Requirements phrased in the imperative as part of algorithms +

    + Tests +

    Tests relating to the content of this specification + may be documented in “Tests” blocks like this one. + Any such block is non-normative.

    +
      +
      +
      +
      +

      Conformant Algorithms

      +

      Requirements phrased in the imperative as part of algorithms (such as "strip any leading space characters" or "return false and abort these steps") are to be interpreted with the meaning of the key word ("must", "should", "may", etc) used in introducing the algorithm.

      -

      Conformance requirements phrased as algorithms or specific steps +

      Conformance requirements phrased as algorithms or specific steps can be implemented in any manner, so long as the end result is equivalent. In particular, the algorithms defined in this specification are intended to be easy to understand and are not intended to be performant. Implementers are encouraged to optimize.

      +

      Index

      @@ -3022,6 +3098,7 @@

      outerHTML, in § 4.7
    • parseFromString(str, type), in § 4.7 +
    • parseHTMLUnsafe(html), in § 4.7
    • Policies, in § 2.3
    • Prepare the script URL and text, in § 3.7
    • Process value with a default policy, in § 3.6 @@ -3034,6 +3111,12 @@

      [[ScriptURL]], in § 4.3.3.1
    • ScriptURLString, in § 4
    • serialized-tt-configuration, in § 4.9.2 +
    • + setHTMLUnsafe(html) +
    • setInterval(handler), in § 4.3.5
    • setInterval(handler, timeout), in § 4.3.5
    • setInterval(handler, timeout, ...arguments), in § 4.3.5 @@ -3093,987 +3176,185 @@

      writeln(...text), in § 4.3.2
    • write(...text), in § 4.3.2 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

      Terms defined by reference

      • [CSP3] defines the following terms:
          -
        • 'report-sample' -
        • 'unsafe-eval' -
        • content security policy object -
        • content-security-policy-report-only -
        • csp list -
        • directive set -
        • directives -
        • disposition -
        • inline check -
        • name -
        • object-src -
        • pre-navigation check -
        • resource -
        • sample -
        • script-src -
        • source expression -
        • value -
        • violation +
        • 'report-sample' +
        • 'unsafe-eval' +
        • content security policy object +
        • content-security-policy-report-only +
        • csp list +
        • directive set +
        • directives +
        • disposition +
        • inline check +
        • name +
        • object-src +
        • pre-navigation check +
        • resource +
        • sample +
        • script-src +
        • source expression +
        • value +
        • violation
      • [DOM] defines the following terms:
          -
        • Document -
        • DocumentFragment -
        • Element -
        • EventTarget -
        • Range -
        • append -
        • attribute -
        • attribute change steps -
        • attribute list -
        • child text content -
        • create an element -
        • element (for Attr) -
        • element interface -
        • handle attribute changes -
        • local name (for Element) -
        • namespace -
        • other applicable specifications -
        • textContent -
        • value +
        • Document +
        • DocumentFragment +
        • Element +
        • EventTarget +
        • Range +
        • ShadowRoot +
        • append +
        • attribute +
        • attribute change steps +
        • attribute list +
        • child text content +
        • create an element +
        • element +
        • element (for Attr) +
        • element interface +
        • handle attribute changes +
        • local name (for Attr) +
        • local name (for Element) +
        • namespace +
        • other applicable specifications +
        • textContent +
        • value
      • [DOM-Parsing] defines the following terms:
          -
        • InnerHTML -
        • SupportedType -
        • fragment parsing algorithm +
        • InnerHTML +
        • SupportedType +
        • fragment parsing algorithm
      • [ECMASCRIPT] defines the following terms:
          -
        • Get -
        • ToString -
        • current realm record +
        • Get +
        • ToString +
        • current realm record
      • [Fetch] defines the following terms:
          -
        • client -
        • local scheme -
        • request -
        • url +
        • client +
        • local scheme +
        • request +
        • url
      • [FileAPI] defines the following terms:
          -
        • Blob +
        • Blob
      • [HTML] defines the following terms:
          -
        • CEReactions -
        • HTMLEmbedElement -
        • HTMLIFrameElement -
        • HTMLObjectElement -
        • HTMLScriptElement -
        • HTMLTemplateElement -
        • SharedWorker -
        • Window -
        • WindowOrWorkerGlobalScope -
        • Worker -
        • WorkerGlobalScope -
        • WorkerOptions -
        • associated document -
        • current global object -
        • global object (for environment settings object) -
        • html fragment serialization algorithm -
        • innerText -
        • prepare the script element -
        • realm -
        • reflect -
        • relevant global object -
        • src (for script) +
        • CEReactions +
        • HTMLEmbedElement +
        • HTMLIFrameElement +
        • HTMLObjectElement +
        • HTMLScriptElement +
        • HTMLTemplateElement +
        • SharedWorker +
        • Window +
        • WindowOrWorkerGlobalScope +
        • Worker +
        • WorkerGlobalScope +
        • WorkerOptions +
        • associated document +
        • current global object +
        • global object (for environment settings object) +
        • global object (for realm) +
        • html fragment serialization algorithm +
        • innerText +
        • prepare the script element +
        • realm +
        • reflect +
        • relevant global object +
        • src (for embed) +
        • src (for script)
      • [INFRA] defines the following terms:
          -
        • append -
        • ascii case-insensitive -
        • ascii lowercase -
        • concatenate -
        • contain -
        • html namespace -
        • ordered set +
        • append +
        • ascii case-insensitive +
        • ascii lowercase +
        • concatenate +
        • contain +
        • html namespace +
        • ordered set
      • - [SERVICE-WORKERS-1] defines the following terms: + [SERVICE-WORKERS] defines the following terms:
          -
        • RegistrationOptions -
        • ServiceWorkerContainer -
        • ServiceWorkerRegistration +
        • RegistrationOptions +
        • ServiceWorkerContainer +
        • ServiceWorkerRegistration
      • [SVG2] defines the following terms:
          -
        • SVGAnimatedString -
        • SVGScriptElement +
        • SVGAnimatedString +
        • SVGScriptElement
      • [URL] defines the following terms:
          -
        • scheme -
        • url parser -
        • url serializer +
        • scheme +
        • url parser +
        • url serializer
      • [WEBIDL] defines the following terms:
          -
        • AllowShared -
        • Clamp -
        • DOMString -
        • EnforceRange -
        • EvalError -
        • Exposed -
        • Function -
        • LegacyNullToEmptyString -
        • NewObject -
        • Promise -
        • SecureContext -
        • TypeError -
        • USVString -
        • any -
        • attribute -
        • boolean -
        • converted to an idl value -
        • extended attribute -
        • identifier -
        • idl fragment -
        • include -
        • interface mixin -
        • long -
        • object -
        • operation -
        • platform object -
        • read only -
        • regular attribute -
        • regular operation -
        • takes an identifier -
        • this -
        • undefined -
        • variadic +
        • AllowShared +
        • Clamp +
        • DOMString +
        • EnforceRange +
        • EvalError +
        • Exposed +
        • Function +
        • LegacyNullToEmptyString +
        • NewObject +
        • Promise +
        • SecureContext +
        • TypeError +
        • USVString +
        • any +
        • attribute +
        • boolean +
        • converted to an idl value +
        • extended attribute +
        • identifier +
        • idl fragment +
        • include +
        • interface mixin +
        • long +
        • object +
        • operation +
        • platform object +
        • read only +
        • regular attribute +
        • regular operation +
        • takes an identifier +
        • this +
        • undefined +
        • variadic

      References

      Normative References

      [CSP3] -
      Content Security Policy Level 3 URL: https://www.w3.org/TR/CSP3/ +
      Mike West; Antonio Sartori. Content Security Policy Level 3. URL: https://w3c.github.io/webappsec-csp/
      [DOM]
      Anne van Kesteren. DOM Standard. Living Standard. URL: https://dom.spec.whatwg.org/
      [DOM-Parsing] @@ -4083,17 +3364,17 @@

      N
      [Fetch]
      Anne van Kesteren. Fetch Standard. Living Standard. URL: https://fetch.spec.whatwg.org/
      [FileAPI] -
      Marijn Kruisselbrink; Arun Ranganathan. File API. URL: https://w3c.github.io/FileAPI/ +
      Marijn Kruisselbrink. File API. URL: https://w3c.github.io/FileAPI/
      [HTML] -
      A vocabulary and associated APIs for HTML and XHTML URL: https://html.spec.whatwg.org/multipage/ +
      Anne van Kesteren; et al. HTML Standard. Living Standard. URL: https://html.spec.whatwg.org/multipage/
      [HTML5]
      Ian Hickson; et al. HTML5. URL: https://www.w3.org/html/wg/drafts/html/master/
      [INFRA]
      Anne van Kesteren; Domenic Denicola. Infra Standard. Living Standard. URL: https://infra.spec.whatwg.org/
      [RFC2119]
      S. Bradner. Key words for use in RFCs to Indicate Requirement Levels. March 1997. Best Current Practice. URL: https://datatracker.ietf.org/doc/html/rfc2119 -
      [SERVICE-WORKERS-1] -
      Alex Russell; et al. Service Workers 1. URL: https://w3c.github.io/ServiceWorker/ +
      [SERVICE-WORKERS] +
      Jake Archibald; Marijn Kruisselbrink. Service Workers. URL: https://w3c.github.io/ServiceWorker/
      [SVG2]
      Amelia Bellamy-Royds; et al. Scalable Vector Graphics (SVG) 2. URL: https://svgwg.org/svg2-draft/
      [URL] @@ -4116,655 +3397,1284 @@

      Remove when DOM #809 is merged.
      Refer to the external document on secure policy design.
      - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + - \ No newline at end of file + } + }); + const overview = document.querySelector(".wpt-overview"); + if(overview) { + overview.appendChild(el('ul',{}, ...browsers.map(formatWptResult))); + document.head.appendChild(el('style', {}, + `.wpt-overview ul { display: flex; flex-flow: row wrap; gap: .2em; justify-content: start; list-style: none; padding: 0; margin: 0;} + .wpt-overview li { padding: .25em 1em; color: black; text-align: center; } + .wpt-overview img { height: 1.5em; height: max(1.5em, 32px); background: transparent; } + .wpt-overview .browser { font-weight: bold; } + .wpt-overview .passes-none { background: #e57373; } + .wpt-overview .passes-hardly { background: #ffb74d; } + .wpt-overview .passes-a-few { background: #ffd54f; } + .wpt-overview .passes-half { background: #fff176; } + .wpt-overview .passes-lots { background: #dce775; } + .wpt-overview .passes-most { background: #aed581; } + .wpt-overview .passes-all { background: #81c784; }`)); + } +}); +function el(name, attrs, ...content) { + const x = document.createElement(name); + for(const [k,v] of Object.entries(attrs)) { + x.setAttribute(k, v); + } + for(let child of content) { + if(typeof child == "string") child = document.createTextNode(child); + try { + x.appendChild(child); + } catch(e) { console.log({x, child}); } + } + return x; +} +function formatWptResult({name, version, passes, total}) { + const passRate = passes/total; + let passClass = ""; + if(passRate == 0) passClass = "passes-none"; + else if(passRate < .2) passClass = "passes-hardly"; + else if(passRate < .4) passClass = "passes-a-few"; + else if(passRate < .6) passClass = "passes-half"; + else if(passRate < .8) passClass = "passes-lots"; + else if(passRate < 1) passClass = "passes-most"; + else passClass = "passes-all"; + + name = name[0].toUpperCase() + name.slice(1); + const shortVersion = /^\d+/.exec(version); + const icon = [] + + if(name == "Chrome") icon.push(el('img', {alt:"", src:"https://wpt.fyi/static/chrome_64x64.png"})); + if(name == "Edge") icon.push(el('img', {alt:"", src:"https://wpt.fyi/static/edge_64x64.png"})); + if(name == "Safari") icon.push(el('img', {alt:"", src:"https://wpt.fyi/static/safari_64x64.png"})); + if(name == "Firefox") icon.push(el('img', {alt:"", src:"https://wpt.fyi/static/firefox_64x64.png"})); + + return el('li', {"class":passClass}, + el('nobr', {'class':'browser'}, ...icon, ` ${name} ${shortVersion}`), + el('br', {}), + el('nobr', {'class':'pass-rate'}, `${passes}/${total}`) + ); +} + \ No newline at end of file