Skip to content

Add external <script type=speculationrules> #11697

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
vickiez wants to merge 12 commits into
base: main
Choose a base branch
from
+117 −43
Open

Add external <script type=speculationrules> #11697

Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
edf71dd
Add external <script type=speculationrules>
vickiez Sep 24, 2025
f2aea41
remove async attribute
vickiez Sep 24, 2025
59d995a
Fix vars and add algorithm
vickiez Dec 10, 2025
404bd9b
fix indentation
vickiez Dec 18, 2025
bca624e
add onComplete algorithm to fetch spec rules
vickiez Dec 22, 2025
797370c
handle script attributes
vickiez Dec 24, 2025
bca62cf
handle crossorigin attr and rewrap
vickiez Dec 24, 2025
84cbdac
format and clean up
vickiez Dec 24, 2025
098b4d8
fix indentation
vickiez Dec 30, 2025
e31b081
fix indentation
vickiez Dec 30, 2025
5cb64e5
follow spec conventions for steps and request
vickiez Jan 20, 2026
f1262fa
remove initiator type and client
vickiez Jan 22, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
160 changes: 117 additions & 43 deletions source
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66070,11 +66070,12 @@ interface <dfn interface>HTMLScriptElement</dfn> : <span>HTMLElement</span> {

<p>The second core attribute is the <dfn for="script" element-attr><code
data-x="attr-script-src">src</code></dfn> attribute. It must only be specified for <span
data-x="classic script">classic scripts</span> and <span data-x="JavaScript module
script">JavaScript module scripts</span>, and denotes that instead of using the element's
<span>child text content</span> as the script content, the script will be fetched from the
specified <span>URL</span>. If <code data-x="attr-script-src">src</code> is specified, it must be
a <span>valid non-empty URL potentially surrounded by spaces</span>.</p>
data-x="classic script">classic scripts</span>, <span data-x="JavaScript module script">JavaScript
module scripts</span>, and <span data-x="speculation rule set">speculation rules</span>, and
denotes that instead of using the element's <span>child text content</span> as the script content,
the script will be fetched from the specified <span>URL</span>. If <code
data-x="attr-script-src">src</code> is specified, it must be a <span>valid non-empty URL
potentially surrounded by spaces</span>.</p>

<p>Which other attributes may be specified on a given <code>script</code> element is determined by
the following table:</p>
Expand Down Expand Up @@ -66143,7 +66144,17 @@ interface <dfn interface>HTMLScriptElement</dfn> : <span>HTMLElement</span> {
<td class="no">&middot;</td>
<td class="no">&middot;</td>
<tr>
<th>Speculation rules</th>
<th>External speculation rules</th>
<td class="no">&middot;</td>
<td class="no">&middot;</td>
<td class="no">&middot;</td>
<td class="no">&middot;</td>
<td class="yes">Yes</td>
<td class="yes">Yes</td>
<td class="yes">Yes</td>
<td class="yes">Yes</td>
<tr>
<th>Inline speculation rules</th>
<td class="no">&middot;</td>
<td class="no">&middot;</td>
<td class="no">&middot;</td>
Expand Down Expand Up @@ -67046,15 +67057,14 @@ document.body.append(script1, script2);
<ol>
<li>
<p>If <var>el</var>'s <span data-x="concept-script-type">type</span> is "<code
data-x="">importmap</code>" or "<code data-x="">speculationrules</code>", then <span>queue an
element task</span> on the <span>DOM manipulation task source</span> given <var>el</var> to
<span data-x="concept-event-fire">fire an event</span> named <code
data-x="event-error">error</code> at <var>el</var>, and return.</p>
data-x="">importmap</code>", then <span>queue an element task</span> on the <span>DOM
manipulation task source</span> given <var>el</var> to <span data-x="concept-event-fire">fire
an event</span> named <code data-x="event-error">error</code> at <var>el</var>, and
return.</p>

<p class="note">External import maps and speculation rules are not currently supported. See <a
href="https://github.com/WICG/import-maps/issues/235">WICG/import-maps issue #235</a> and <a
href="https://github.com/WICG/nav-speculation/issues/348">WICG/nav-speculation issue #348</a>
for discussions on adding support.</p>
<p class="note">External import maps are not currently supported. See <a
href="https://github.com/WICG/import-maps/issues/235">WICG/import-maps issue #235</a> for
discussions on adding support.</p>
</li>

<li><p>Let <var>src</var> be the value of <var>el</var>'s <code
Expand Down Expand Up @@ -67116,6 +67126,21 @@ document.body.append(script1, script2);
<p><span>Fetch an external module script graph</span> given <var>url</var>, <var>settings
object</var>, <var>options</var>, and <var>onComplete</var>.</p>
</dd>

<dt>"<code data-x="">speculationrules</code>"</dt>
<dd>
<p><span data-x="fetch speculation rules">Fetch speculation rules</span> given
<var>url</var>, <var>el</var>'s <span>node document</span>, <var>options</var>, and the
following steps given <var>speculationRulesText</var>:</p>

<ol>
<li><p>Let <var>result</var> be the result of <span data-x="create a speculation rules parse
result">parsing</span> <var>speculationRulesText</var> given <var>el</var>'s <span>node
document</span>.</p></li>

<li><p>Run <var>onComplete</var> given <var>result</var>.</p></li>
</ol>
</dd>
</dl>

<p>For performance reasons, user agents may start fetching the classic script or module graph
Expand Down Expand Up @@ -112625,7 +112650,7 @@ new PaymentRequest(&hellip;); // Allowed to use
are delivered as JSON documents, via either:</p>

<ul>
<li><p>inline <code>script</code> elements with their <code data-x="attr-script-type">type</code>
<li><p><code>script</code> elements with their <code data-x="attr-script-type">type</code>
attribute set to "<code data-x="">speculationrules</code>"; or</p></li>

<li><p>resources fetched from a URL specified in the `<code>Speculation-Rules</code>` HTTP
Expand Down Expand Up @@ -114366,37 +114391,15 @@ new PaymentRequest(&hellip;); // Allowed to use
steps:</p>

<ol>
<li><p>Let <var>request</var> be a new <span data-x="concept-request">request</span> whose
<span data-x="concept-request-url">URL</span> is <var>url</var>, <span
data-x="concept-request-destination">destination</span> is "<code
data-x="">speculationrules</code>", and <span data-x="concept-request-mode">mode</span> is
"<code data-x="">cors</code>".</p></li>

<li>
<p><span data-x="concept-fetch">Fetch</span> <var>request</var> with the following <i
data-x="processResponseConsumeBody">processResponseConsumeBody</i> steps given <span
data-x="concept-response">response</span> <var>response</var> and null, failure, or a
<span>byte sequence</span> <var>bodyBytes</var>:</p>
<p><span data-x="fetch speculation rules">Fetch speculation rules</span> given
<var>url</var>, <var>document</var>, and the following steps given
<var>speculationRulesText</var>:</p>

<ol>
<li><p>If <var>bodyBytes</var> is null or failure, then abort these steps.</p></li>

<li><p>If <var>response</var>'s <span data-x="concept-response-status">status</span> is
not an <span>ok status</span>, then abort these steps.</p></li>

<li><p>If the result of <span data-x="extract a MIME type">extracting a MIME type</span>
from <var>response</var>'s <span data-x="concept-response-header-list">header list</span>
does not have an <span data-x="MIME type essence">essence</span> of
"<code>application/speculationrules+json</code>", then abort these steps.</p></li>

<li><p>Let <var>bodyText</var> be the result of <span data-x="UTF-8 decode">UTF-8
decoding</span> <var>bodyBytes</var>.</p></li>

<li><p>Let <var>ruleSet</var> be the result of <span data-x="parse a speculation rule set
string">parsing a speculation rule set string</span> given <var>bodyText</var>,
<var>document</var>, and <var>response</var>'s <span
data-x="concept-response-url">URL</span>. If this throws an exception, then abort these
steps.</p></li>
<li><p>Let <var>ruleSet</var> be the result of <span data-x="parse a speculation rule
set string">parsing</span> <var>speculationRulesText</var> given <var>document</var>
and <var>url</var>.</p></li>

<li><p><span data-x="list append">Append</span> <var>ruleSet</var> to
<var>document</var>'s <span data-x="document-sr-sets">speculation rule
Expand Down Expand Up @@ -117366,6 +117369,77 @@ document.querySelector("button").addEventListener("click", bound);
</ol>
</div>

<div algorithm="">
<p>To <dfn>fetch speculation rules</dfn>, given a <span>URL</span> <var>url</var>,
<code>Document</code> <var>document</var>, an optional <span>script fetch options</span>-or-null
<var>options</var> (default null), and an algorithm <var>onComplete</var>, run these steps.
<var>onComplete</var> must be an algorithm accepting a <span>string</span>.</p>

<ol>
<li>
<p>Let <var>request</var> be a new <span data-x="concept-request">request</span>, with</p>

<dl class="props">
<dt><span data-x="concept-request-url">url</span></dt>
<dd><var>url</var></dd>

<dt><span data-x="concept-request-destination">destination</span></dt>
<dd>"<code data-x="">speculationrules</code>"</dd>

<dt><span data-x="concept-request-mode">mode</span></dt>
<dd>"<code data-x="">cors</code>"</dd>
</dl>
</li>

<li>
<p>If <var>options</var> is not null, then:</p>

<ol>
<li><p>Set <var>request</var>'s <span data-x="concept-request-credentials-mode">credentials
mode</span> to <var>options</var>'s <span
data-x="concept-script-fetch-options-credentials">credentials mode</span>.</p></li>

<li><p>Set <var>request</var>'s <span data-x="concept-request-integrity-metadata">integrity
metadata</span> to <var>options</var>'s <span
data-x="concept-script-fetch-options-integrity">integrity metadata</span>.</p></li>

<li><p>Set <var>request</var>'s <span data-x="concept-request-referrer-policy">referrer
policy</span> to <var>options</var>'s <span
data-x="concept-script-fetch-options-referrer-policy">referrer policy</span>.</p></li>

<li><p>Set <var>request</var>'s <span data-x="concept-request-priority">priority</span> to
<var>options</var>'s <span data-x="concept-script-fetch-options-fetch-priority">fetch
priority</span>.</p></li>
</ol>
</li>
<li>
<p><span data-x="concept-fetch">Fetch</span> <var>request</var> with the following <i
data-x="processResponseConsumeBody">processResponseConsumeBody</i> steps given
<var>response</var> and <var>bodyBytes</var>:</p>

<ol>
<li><p>If <var>bodyBytes</var> is null or failure, then run <var>onComplete</var> given the
empty string, and return.</p></li>

<li><p>If <var>response</var>'s <span data-x="concept-response-status">status</span> is not an
<span>ok status</span>, then run <var>onComplete</var> given the empty string, and
return.</p></li>

<li><p>If the result of <span data-x="extract a MIME type">extracting a MIME type</span> from
<var>response</var>'s <span data-x="concept-response-header-list">header list</span> does not
have an <span data-x="MIME type essence">essence</span> of
"<code>application/speculationrules+json</code>", then run <var>onComplete</var> given the
empty string, and return.</p></li>

<li><p>Let <var>speculationRulesText</var> be the result of <span data-x="UTF-8 decode">UTF-8
decoding</span> <var>bodyBytes</var>.</p></li>

<li><p>Run <var>onComplete</var> given <var>speculationRulesText</var>.</p></li>
</ol>
</li>
</ol>
</div>

<h5 id="creating-scripts">Creating scripts</h5>

<div algorithm>
Expand Down