Skip to content

Commit

Permalink
NavigationDestination section and NavigateEvent domintro
Browse files Browse the repository at this point in the history
  • Loading branch information
domenic committed Nov 14, 2022
1 parent a8100ef commit 99f4e40
Showing 1 changed file with 93 additions and 7 deletions.
100 changes: 93 additions & 7 deletions source
Original file line number Diff line number Diff line change
Expand Up @@ -87061,7 +87061,7 @@ interface <dfn interface>NavigationHistoryEntry</dfn> : <span>EventTarget</span>
<dd><p>The index of this <code>NavigationHistoryEntry</code> within <code data-x="dom-Navigation-entries">navigation.entries()</code>, or &minus;1 if the entry is not in the navigation history entry list.</p></dd>

<dt><code data-x=""><var>entry</var>.<span subdfn data-x="dom-NavigationHistoryEntry-sameDocument">sameDocument</span></code></dt>
<dd><p>Indicates whether or not this navigation history entry is for the same <code>Document</code> as the current one, or not. This will be true, for exampel, when the entry represents a fragment navigation or single-page app navigation.</p></dd>
<dd><p>Indicates whether or not this navigation history entry is for the same <code>Document</code> as the current one, or not. This will be true, for example, when the entry represents a fragment navigation or single-page app navigation.</p></dd>

<dt><code data-x=""><var>entry</var>.<span subdfn data-x="dom-NavigationHistoryEntry-getState">getState</span>()</code></dt>
<dd>
Expand Down Expand Up @@ -88035,6 +88035,48 @@ callback <dfn callback>NavigationInterceptHandler</dfn> = Promise&lt;undefined>

<p>(Notably, this will be null even for "<code data-x="dom-NavigationType-reload">reload</code>" or "<code data-x="dom-NavigationType-traverse">traverse</code>" navigations that are revisiting a <span>session history entry</span> that was originally created from a form submission.)</p>
</dd>

<dt><code data-x=""><var>event</var>.<span subdfn data-x="dom-NavigateEvent-downloadRequest">downloadRequest</span></code></dt>
<dd>
<p>Represents whether or not this navigation was requested to be a download, by using an <code>a</code> or <code>area</code> element's <code data-x="attr-hyperlink-download">download</code> attribute:</p>

<ul>
<li><p>If a download was not requested, then this property is null.</p></li>

<li><p>If a download was requested, returns the filename that was supplied as the <code data-x="attr-hyperlink-download">download</code> attribute's value. (This could be the empty string.)</p></li>
</ul>

<p>Note that a download being requested does not always mean that a download will happen: for example, a download might be blocked by browser security policies, or end up being treated as a "<code data-x="hh-push">push</code>" navigation for <a href="https://github.com/whatwg/html/issues/7718" class="XXX">unspecified reasons</a>.</p>

<p>Similarly, a navigation might end up being a download even if it was not requested to be one, due to the destination server responding with a `<code data-x="http-content-disposition">Content-Disposition: attachment</code>` header.</p>

<p>Finally, note that the <code data-x="event-navigate">navigate</code> event will not fire at all for downloads initiated using browser UI affordances, e.g., those created by right-clicking and choosing to save the target of a link.</p>
</dd>

<dt><code data-x=""><var>event</var>.<span subdfn data-x="dom-NavigateEvent-info">info</span></code></dt>
<dd><p>An arbitrary JavaScript value passed via one of the <a href="#navigation-api-initiating-navigations">navigation API methods</a> which initiated this navigation, or undefined if the navigation was initiated by the user or by a different API.</p></dd>

<dt><code data-x=""><var>event</var>.<span subdfn data-x="dom-NavigateEvent-intercept">intercept</span>({ <span subdfn data-x="dom-NavigationInterceptOptions-handler">handler</span>, <span subdfn data-x="dom-NavigationInterceptOptions-focusReset">focusReset</span>, <span subdfn data-x="dom-NavigationInterceptOptions-scroll">scroll</span> })</code></dt>
<dd>
<p>Intercepts this navigation, preventing its normal handling and instead converting it into a same-document navigation of the same type to the destination URL.</p>

<p>The <code data-x="dom-NavigationInterceptOptions-handler">handler</code> option can be a function that returns a promise. The handler function will run after the <code data-x="event-navigate">navigate</code> event has finished firing, and the <code data-x="dom-Navigation-currentEntry">navigation.currentEntry</code> property has been synchronously updated. This returned promise is used to signal the duration, and success or failure, of the navigation. After it settles, the browser signals to the user (e.g., via a loading spinner UI, or assistive technology) that the navigation is finished. Additionally, it fires <code data-x="event-navigatesuccess">navigatesuccess</code> or <code data-x="event-navigateerror">navigateerror</code> events as appropriate, which other parts of the web application can respond to.</p>

<p>By default, using this method will cause focus to reset when any handlers' returned promises settle. Focus will be reset to the first element with the <code data-x="attr-fe-autofocus">autofocus</code> attribute set, or <span>the body element</span> if the attribute isn't present. The <code data-x="dom-NavigationInterceptOptions-focusReset">focusReset</code> option can be set to "<code data-x="dom-NavigationFocusReset-manual">manual</code>" to avoid this behavior.</p>

<p>By default, using this method will delay the browser's scroll restoration logic for "<code data-x="dom-NavigationType-traverse">traverse</code>" or "<code data-x="dom-NavigationType-reload">reload</code>" navigations, or its scroll-reset/scroll-to-a-fragment logic for "<code data-x="dom-NavigationType-push">push</code>" or "<code data-x="dom-NavigationType-replace">replace</code>" navigations, until any handlers' returned promises settle. The <code data-x="dom-NavigationInterceptOptions-scroll">scroll</code> option can be set to "<code data-x="dom-NavigationScrollBehavior-manual">manual</code>" to turn off any browser-driven scroll behavior entirely for this navigation, or <code data-x="dom-NavigateEvent-scroll">scroll()</code> can be called before the promise settles to trigger this behavior early.</p>

<p>This method will throw a <span>"<code>SecurityError</code>"</span> <code>DOMException</code> if <code data-x="dom-NavigateEvent-canIntercept">canIntercept</code> is false, or if <code data-x="dom-Event-isTrusted">isTrusted</code> is false. It will throw an <span>"<code>InvalidStateError</code>"</span> <code>DOMException</code> if not called synchronously, during event dispatch.</p>
</dd>

<dt><code data-x=""><var>event</var>.<span subdfn data-x="dom-NavigateEvent-scroll">scroll</span>()</code></dt>
<dd>
<p>For "<code data-x="dom-NavigationType-traverse">traverse</code>" or "<code data-x="dom-NavigationType-reload">reload</code>" navigations, restores the scroll position using the browser's usual scroll restoration logic.</p>

<p>For "<code data-x="dom-NavigationType-push">push</code>" or "<code data-x="dom-NavigationType-replace">replace</code>" navigations, either resets the scroll position to the top of the document or scrolls to the <span data-x="concept-url-fragment">fragment</span> specified by <code data-x="dom-NavigationDestination-url">destination.url</code> if there is one.</p>

<p>If called more than once, or called after automatic post-transition scroll processing has happened due to the <code data-x="dom-NavigationInterceptOptions-scroll">scroll</code> option bieng left as "<code data-x="dom-NavigationScrollBehavior-after-transition">after-transition</code>", this method will throw an <span>"<code>InvalidStateError</code>"</span> <code>DOMException</code>.</p>
</dd>
</dl>

<p>The <dfn attribute for="NavigateEvent"><code
Expand Down Expand Up @@ -88073,21 +88115,65 @@ interface <dfn interface>NavigationDestination</dfn> {
any <span data-x="dom-NavigationDestination-getState">getState</span>();
};</code></pre>

<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-url">url</code></dfn> getter steps are: TODO.</p>
<dl class="domintro">
<dt><code data-x=""><var>event</var>.<span data-x="dom-NavigateEvent-destination">destination</span>.<span data-x="dom-NavigationDestination-url">url</span></code></dt>
<dd><p>The URL being navigated to.</p></dd>

<dt><code data-x=""><var>event</var>.<span data-x="dom-NavigateEvent-destination">destination</span>.<span data-x="dom-NavigationDestination-key">key</span></code></dt>
<dd><p>The value of the <code data-x="dom-NavigationHistoryEntry-key">key</code> property of the destination <code>NavigationHistoryEntry</code>, if this is a "<code data-x="dom-NavigationType-traverse">traverse</code>" navigation, or null otherwise. </p></dd>

<dt><code data-x=""><var>event</var>.<span data-x="dom-NavigateEvent-destination">destination</span>.<span data-x="dom-NavigationDestination-id">id</span></code></dt>
<dd><p>The value of the <code data-x="dom-NavigationHistoryEntry-id">id</code> property of the destination <code>NavigationHistoryEntry</code>, if this is a "<code data-x="dom-NavigationType-traverse">traverse</code>" navigation, or null otherwise. </p></dd>

<dt><code data-x=""><var>event</var>.<span data-x="dom-NavigateEvent-destination">destination</span>.<span data-x="dom-NavigationDestination-index">index</span></code></dt>
<dd><p>The value of the <code data-x="dom-NavigationHistoryEntry-index">index</code> property of the destination <code>NavigationHistoryEntry</code>, if this is a "<code data-x="dom-NavigationType-traverse">traverse</code>" navigation, or &minus;1 otherwise. </p></dd>

<dt><code data-x=""><var>event</var>.<span data-x="dom-NavigateEvent-destination">destination</span>.<span data-x="dom-NavigationDestination-sameDocument">sameDocument</span></code></dt>
<dd>
<p>Indicates whether or not this navigation is to the same <code>Document</code> as the current one, or not. This will be true, for example, in the case of fragment navigations or <code data-x="dom-history-pushState">history.pushState()</code> navigations.</p>

<p>Note that this property indicates the original nature of the navigation. If a cross-document navigation is converted into a same-document navigation using <code data-x="dom-NavigateEvent-intercept">navigateEvent.intercept()</code>, that will not change the value of this property.</p>
</dd>

<dt><code data-x=""><var>event</var>.<span data-x="dom-NavigateEvent-destination">destination</span>.<span data-x="dom-NavigationDestination-getState">getState</span>()</code></dt>
<dd>
<p>For "<code data-x="dom-NavigationType-traverse">traverse</code>" navigations, returns the <span data-x="StructuredDeserialize">deserialization</span> of the state stored in the destination <span>session history entry</span>.</p>

<p>For "<code data-x="dom-NavigationType-push">push</code>" or "<code data-x="dom-NavigationType-replace">replace</code>" navigations, returns the <span data-x="StructuredDeserialize">deserialization</span> of the state passed to <code data-x="dom-Navigation-navigate">navigation.navigate()</code>, if the navigation was initiated by that method, or undefined it if it wasn't.</p>

<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-key">key</code></dfn> getter steps are: TODO.</p>
<p>For "<code data-x="dom-NavigationType-reload">reload</code>" navigations, returns the <span data-x="StructuredDeserialize">deserialization</span> of the state passed to <code data-x="dom-Navigation-reload">navigation.reload()</code>, if the reload was initiated by that method, or undefined it if it wasn't.</p>
</dd>
</dl>

<p>Each <code>NavigationDestination</code> has a <dfn data-x="concept-NavigationDestination-url">URL</dfn>, which is a <span>URL</span>.</p>

<p>Each <code>NavigationDestination</code> has a <dfn data-x="concept-NavigationDestination-key">key</dfn>, which is a string or null.</p>

<p>Each <code>NavigationDestination</code> has an <dfn data-x="concept-NavigationDestination-id">ID</dfn>, which is a string or null.</p>

<p>Each <code>NavigationDestination</code> has an <dfn data-x="concept-NavigationDestination-index">index</dfn>, which is an integer.</p>

<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-id">id</code></dfn> getter steps are: TODO.</p>
<p>Each <code>NavigationDestination</code> has a <dfn data-x="concept-NavigationDestination-state">state</dfn>, which is a <span>serialized state</span>.</p>

<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-index">index</code></dfn> getter steps are: TODO.</p>
<p>Each <code>NavigationDestination</code> has an <dfn data-x="concept-NavigationDestination-sameDocument">is same document</dfn>, which is a boolean.</p>

<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-sameDocument">sameDocument</code></dfn> getter steps are: TODO.</p>
<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-url">url</code></dfn> getter steps are to return <span>this</span>'s <span data-x="concept-NavigationDestination-url">URL</span>, <span data-x="concept-url-serializer">serialized</span>.</p>

<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-getState">getState()</code></dfn> method steps are: TODO.</p>
<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-key">key</code></dfn> getter steps are to return <span>this</span>'s <span data-x="concept-NavigationDestination-key">key</span>.</p>

<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-id">id</code></dfn> getter steps are to return <span>this</span>'s <span data-x="concept-NavigationDestination-id">ID</span>.</p>

<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-index">index</code></dfn> getter steps are to return <span>this</span>'s <span data-x="concept-NavigationDestination-index">index</span>.</p>

<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-sameDocument">sameDocument</code></dfn> getter steps are to return <span>this</span>'s <span data-x="concept-NavigationDestination-sameDocument">is same document</span>.</p>

<p>The <dfn attribute for="NavigationDestination"><code data-x="dom-NavigationDestination-getState">getState()</code></dfn> method steps are to return <span>StructuredDeserialize</span>(<span>this</span>'s <span data-x="concept-NavigationDestination-state">state</span>).</p>


<h4 id="nav-traversal-event-interfaces">Event interfaces</h4>

<p class="note">The <code>NavigateEvent</code> interface has <a href="#the-navigate-event">its own dedicated section</a>, due to its complexity.</p>


<h5>The <code>NavigationCurrentEntryChangeEvent</code> interface</h5>

Expand Down

0 comments on commit 99f4e40

Please sign in to comment.