Adds TrustedTypePolicyFactory

files/en-us/web/api/trustedtypepolicyfactory/createpolicy/index.html

@@ -0,0 +1,70 @@
+---
+title: TrustedTypePolicyFactory.createPolicy()
+slug: Web/API/TrustedTypePolicyFactory/createPolicy
+tags:
+  - API
+  - Method
+  - Reference
+  - createPolicy
+  - TrustedTypePolicyFactory
+---
+<div>{{DefaultAPISidebar("Trusted Types API")}}</div>
+
+<p class="summary">The <strong><code>createPolicy()</code></strong> method of the {{domxref("TrustedTypePolicyFactory")}} interface creates a {{domxref("TrustedTypePolicy")}} object that implements the rules passed as <code>policyOptions</code>.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">var <var>policy</var> = <var>TrustedTypePolicyFactory</var>.createPolicy(<var>policyName</var>,<var>policyOptions</var>);</pre>
+
+<h3 id="Parameters">Parameters</h3>
+
+<dl>
+  <dt><code>policyName</code></dt>
+  <dd>A {{domxref("DOMString")}} with the name of the policy.</dd>
+  <dt><code>policyOptions</code>{{optional_inline}}</dt>
+  <dd>A {{domxref("TrustedTypePolicyOptions")}} dictionary of user-defined functions for converting strings into trusted values.</dd>
+</dl>
+
+<h3 id="Returns">Return value</h3>
+
+<p>A {{domxref("TrustedTypePolicy")}} object.</p>
+
+<h3 id="Exceptions">Exceptions</h3>
+
+<dl>
+  <dt>{{jsxref("TypeError")}}</dt>
+  <dd>Thrown if policy names are restricted by the <a href="/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/trusted-types">Content Security Policy `trusted-types` directive</a> and this name is not on the allowlist.</dd>
+  <dt>{{jsxref("TypeError")}}</dt>
+  <dd>Thrown if the name is a duplicate and the <a href="/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/trusted-types">Content Security Policy trusted-types directive</a> is not using <code>allow-duplicates</code>.</dd>
+</dl>
+
+<h2 id="Examples">Examples</h2>
+
+<p>The below code creates a policy with the name <code>myEscapePolicy</code> with a function defined for <code>createHTML</code> which sanitizes HTML.</p>
+
+<pre class="brush: js">const escapeHTMLPolicy = trustedTypes.createPolicy("myEscapePolicy", {
+  createHTML: (string) =&gt; string.replace(/\&gt;/g, "&lt;")
+});</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+  <tbody>
+   <tr>
+    <th scope="col">Specification</th>
+    <th scope="col">Status</th>
+    <th scope="col">Comment</th>
+   </tr>
+   <tr>
+    <td>{{SpecName('Trusted Types','#dom-trustedtypepolicyfactory-createpolicy','TrustedTypePolicyFactory.createPolicy()')}}</td>
+    <td>{{Spec2('Trusted Types')}}</td>
+    <td>Initial definition.</td>
+   </tr>
+  </tbody>
+ </table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
+
+<p>{{Compat("api.TrustedTypePolicyFactory.createPolicy")}}</p>

files/en-us/web/api/trustedtypepolicyfactory/defaultpolicy/index.html

@@ -0,0 +1,51 @@
+---
+title: TrustedTypePolicyFactory.defaultPolicy
+slug: Web/API/TrustedTypePolicyFactory/defaultPolicy
+tags:
+  - API
+  - Property
+  - Reference
+  - defaultPolicy
+  - TrustedTypePolicyFactory
+---
+<div>{{DefaultAPISidebar("Trusted Types API")}}</div>
+
+<p class="summary">The <strong><code>defaultPolicy</code></strong> read-only property of the {{domxref("TrustedTypePolicyFactory")}} interface returns the default {{domxref("TrustedTypePolicy")}} or null if this is empty.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">var <var>defaultPolicy</var> = <var>TrustedTypePolicyFactory</var>.defaultPolicy;</pre>
+
+<h3>Value</h3>
+<p>A {{domxref("TrustedTypePolicy")}} or null.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<p>The first line below returns null as no default policy has been created. Once a default policy is created, calling <code>defaultPolicy</code> returns that policy object.</p>
+
+<pre class="brush: js">console.log(trustedTypes.defaultPolicy); // null
+const dp = trustedTypes.createPolicy('default', {});
+console.log(trustedTypes.defaultPolicy); // a TrustedTypePolicy object</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+  <tbody>
+   <tr>
+    <th scope="col">Specification</th>
+    <th scope="col">Status</th>
+    <th scope="col">Comment</th>
+   </tr>
+   <tr>
+    <td>{{SpecName('Trusted Types','#dom-trustedtypepolicyfactory-defaultpolicy','TrustedTypePolicyFactory.defaultPolicy')}}</td>
+    <td>{{Spec2('Trusted Types')}}</td>
+    <td>Initial definition.</td>
+   </tr>
+  </tbody>
+ </table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
+
+<p>{{Compat("api.TrustedTypePolicyFactory.defaultPolicy")}}</p>

files/en-us/web/api/trustedtypepolicyfactory/emptyhtml/index.html

@@ -0,0 +1,49 @@
+---
+title: TrustedTypePolicyFactory.emptyHTML
+slug: Web/API/TrustedTypePolicyFactory/emptyHTML
+tags:
+  - API
+  - Property
+  - Reference
+  - emptyHTML
+  - TrustedTypePolicyFactory
+---
+<div>{{DefaultAPISidebar("Trusted Types API")}}</div>
+
+<p class="summary">The <strong><code>emptyHTML</code></strong> read-only property of the {{domxref("TrustedTypePolicyFactory")}} interface returns a {{domxref("TrustedHTML")}} object containing an empty string.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">var <var>emptyHTML</var> = <var>TrustedTypePolicyFactory</var>.emptyHTML;</pre>
+
+<h3>Value</h3>
+<p>A {{domxref("TrustedHTML")}} object.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<p>In the below example an empty string is to be inserted into the element. Therefore there is no need to create a policy, and the <code>emptyHTML</code> property can be used to insert the empty element when a Trusted Types object is expected.</p>
+
+<pre class="brush: js">el.innerHTML = trustedTypes.emptyHTML;</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+  <tbody>
+   <tr>
+    <th scope="col">Specification</th>
+    <th scope="col">Status</th>
+    <th scope="col">Comment</th>
+   </tr>
+   <tr>
+    <td>{{SpecName('Trusted Types','#dom-trustedtypepolicyfactory-emptyhtml','TrustedTypePolicyFactory.emptyHTML')}}</td>
+    <td>{{Spec2('Trusted Types')}}</td>
+    <td>Initial definition.</td>
+   </tr>
+  </tbody>
+ </table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
+
+<p>{{Compat("api.TrustedTypePolicyFactory.emptyHTML")}}</p>

files/en-us/web/api/trustedtypepolicyfactory/emptyscript/index.html

@@ -0,0 +1,52 @@
+---
+title: TrustedTypePolicyFactory.emptyScript
+slug: Web/API/TrustedTypePolicyFactory/emptyScript
+tags:
+  - API
+  - Property
+  - Reference
+  - emptyScript
+  - TrustedTypePolicyFactory
+---
+<div>{{DefaultAPISidebar("Trusted Types API")}}</div>
+
+<p class="summary">The <strong><code>emptyScript</code></strong> read-only property of the {{domxref("TrustedTypePolicyFactory")}} interface returns a {{domxref("TrustedScript")}} object containing an empty string.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">var <var>emptyScript</var> = <var>TrustedTypePolicyFactory</var>.emptyScript;</pre>
+
+<h3>Value</h3>
+<p>A {{domxref("TrustedScript")}} object.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<p>The <a href="https://w3c.github.io/webappsec-trusted-types/dist/spec/#dom-trustedtypepolicyfactory-emptyscript">specification</a> explains that the <code>emptyScript</code> object can be used to detect support for dynamic code compilation.</p>
+
+<p>Native Trusted Types implementations can support <code>eval(TrustedScript)</code>, therefore in the below example in a native implementation will return false for <code>eval(trustedTypes.emptyScript)</code>. A polyfill will return a truthy object.</p>
+
+<pre class="brush: js">const supportsTS = !eval(trustedTypes.emptyScript);
+eval(supportsTS ? myTrustedScriptObj : myTrustedScriptObj.toString());</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+  <tbody>
+   <tr>
+    <th scope="col">Specification</th>
+    <th scope="col">Status</th>
+    <th scope="col">Comment</th>
+   </tr>
+   <tr>
+    <td>{{SpecName('Trusted Types','#dom-trustedtypepolicyfactory-emptyscript','TrustedTypePolicyFactory.emptyScript')}}</td>
+    <td>{{Spec2('Trusted Types')}}</td>
+    <td>Initial definition.</td>
+   </tr>
+  </tbody>
+ </table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
+
+<p>{{Compat("api.TrustedTypePolicyFactory.emptyScript")}}</p>

files/en-us/web/api/trustedtypepolicyfactory/getattributetype/index.html

@@ -0,0 +1,70 @@
+---
+title: TrustedTypePolicyFactory.getAttributeType()
+slug: Web/API/TrustedTypePolicyFactory/getAttributeType
+tags:
+  - API
+  - Method
+  - Reference
+  - getAttributeType
+  - TrustedTypePolicyFactory
+---
+<div>{{DefaultAPISidebar("Trusted Types API")}}</div>
+
+<p class="summary">The <strong><code>getAttributeType()</code></strong> method of the {{domxref("TrustedTypePolicyFactory")}} interface allows web developers to check if a Trusted Type is required for an element, and if so which Trusted Type is used.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">var <var>attributeType</var> = <var>TrustedTypePolicyFactory</var>.getAttributeType(<var>tagName</var>,<var>attribute</var>[,<var>elementNs</var>,<var>attrNs</var>]);</pre>
+
+<h3 id="Parameters">Parameters</h3>
+
+<dl>
+  <dt><code>tagName</code></dt>
+  <dd>A {{domxref("DOMString","string")}} containing the name of an HTML tag.</dd>
+  <dt><code>attribute</code></dt>
+  <dd>A {{domxref("DOMString","string")}} containing an attribute.</dd>
+  <dt><code>elementNs</code>{{optional_inline}}</dt>
+  <dd>A {{domxref("DOMString","string")}} containing a namespace.</dd>
+  <dt><code>attrNs</code>{{optional_inline}}</dt>
+  <dd>A {{domxref("DOMString","string")}} containing a namespace.</dd>
+</dl>
+
+<h3 id="Returns">Return value</h3>
+
+<p>A {{domxref("DOMString","string")}} with one of:</p>
+<ul>
+  <li>"TrustedHTML"</li>
+  <li>"TrustedScript"</li>
+  <li>"TrustedScriptURL</li>
+</ul>
+
+<p>Or, null.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<p>In this example, passing the {{htmlelement("script")}} element and {{htmlattrxref("src")}} attribute to <code>getAttributeType</code> returns "TrustedScriptURL".</p>
+
+<pre class="brush: js">console.log(trustedTypes.getAttributeType('script', 'src')); // "TrustedScriptURL"</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+  <tbody>
+   <tr>
+    <th scope="col">Specification</th>
+    <th scope="col">Status</th>
+    <th scope="col">Comment</th>
+   </tr>
+   <tr>
+    <td>{{SpecName('Trusted Types','#dom-trustedtypepolicyfactory-getattributetype','TrustedTypePolicyFactory.getAttributeType()')}}</td>
+    <td>{{Spec2('Trusted Types')}}</td>
+    <td>Initial definition.</td>
+   </tr>
+  </tbody>
+ </table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
+
+<p>{{Compat("api.TrustedTypePolicyFactory.getAttributeType")}}</p>

files/en-us/web/api/trustedtypepolicyfactory/getpropertytype/index.html

@@ -0,0 +1,68 @@
+---
+title: TrustedTypePolicyFactory.getPropertyType()
+slug: Web/API/TrustedTypePolicyFactory/getPropertyType
+tags:
+  - API
+  - Method
+  - Reference
+  - getPropertyType
+  - TrustedTypePolicyFactory
+---
+<div>{{DefaultAPISidebar("Trusted Types API")}}</div>
+
+<p class="summary">The <strong><code>getPropertyType()</code></strong> method of the {{domxref("TrustedTypePolicyFactory")}} interface allows web developers to check if a Trusted Type is required for an element's property.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">var <var>null</var> = TrustedTypePolicyFactory.getPropertyType(<var>tagName</var>,<var>property</var>[, <var>elementNS</var>]);</pre>
+
+<h3 id="Parameters">Parameters</h3>
+
+<dl>
+  <dt><code>tagName</code></dt>
+  <dd>A {{domxref("DOMString","string")}} containing the name of an HTML tag.</dd>
+  <dt><code>property</code></dt>
+  <dd>A {{domxref("DOMString","string")}} containing a property, for example <code>"innerHTML"</code>.</dd>
+  <dt><code>elementNs</code>{{optional_inline}}</dt>
+  <dd>A {{domxref("DOMString","string")}} containing a namespace.</dd>
+</dl>
+
+<h3 id="Returns">Return value</h3>
+
+<p>A {{domxref("DOMString","string")}} with one of:</p>
+<ul>
+  <li>"TrustedHTML"</li>
+  <li>"TrustedScript"</li>
+  <li>"TrustedScriptURL</li>
+</ul>
+
+<p>Or, null.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<p>In this example, passing the {{htmlelement("div")}} element and <code>innerHTML</code> property to <code>getPropertyType</code> returns "TrustedHTML".</p>
+
+<pre class="brush: js">console.log(trustedTypes.getPropertyType('div', 'innerHTML')); // "TrustedHTML"</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+  <tbody>
+   <tr>
+    <th scope="col">Specification</th>
+    <th scope="col">Status</th>
+    <th scope="col">Comment</th>
+   </tr>
+   <tr>
+    <td>{{SpecName('Trusted Types','#dom-trustedtypepolicyfactory-getpropertytype','TrustedTypePolicyFactory.getPropertyType()')}}</td>
+    <td>{{Spec2('Trusted Types')}}</td>
+    <td>Initial definition.</td>
+   </tr>
+  </tbody>
+ </table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
+
+<p>{{Compat("api.TrustedTypePolicyFactory.getPropertyType")}}</p>