From 22526bdf0076aec093ba0a1ba32a6bb0d4ffd853 Mon Sep 17 00:00:00 2001
From: skyclouds2001 <95597335+skyclouds2001@users.noreply.github.com>
Date: Thu, 31 Oct 2024 12:58:07 +0800
Subject: [PATCH] Add docs for `Request.isHistoryNavigation` (#36514)

* Add docs for `Request.isHistoryNavigation`

* Apply suggestions from code review

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/web/api/request/ishistorynavigation/index.md

* Apply suggestions from code review

* Apply suggestions from code review

Co-authored-by: wbamberg <will@bootbonnet.ca>

---------

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: wbamberg <will@bootbonnet.ca>
---
 files/en-us/web/api/request/index.md          |  2 +
 .../api/request/ishistorynavigation/index.md  | 63 +++++++++++++++++++
 files/en-us/web/api/requestinit/index.md      |  2 +-
 3 files changed, 66 insertions(+), 1 deletion(-)
 create mode 100644 files/en-us/web/api/request/ishistorynavigation/index.md

diff --git a/files/en-us/web/api/request/index.md b/files/en-us/web/api/request/index.md
index 851e00658794020..00b0046686c8a64 100644
--- a/files/en-us/web/api/request/index.md
+++ b/files/en-us/web/api/request/index.md
@@ -32,6 +32,8 @@ You can create a new `Request` object using the {{domxref("Request.Request","Req
   - : Contains the associated {{domxref("Headers")}} object of the request.
 - {{domxref("Request.integrity")}} {{ReadOnlyInline}}
   - : Contains the [subresource integrity](/en-US/docs/Web/Security/Subresource_Integrity) value of the request (e.g., `sha256-BpfBw7ivV8q2jLiT13fxDYAe2tJllusRSZ273h2nFSE=`).
+- {{domxref("Request.isHistoryNavigation")}} {{ReadOnlyInline}}
+  - : A boolean indicating whether the request is a history navigation.
 - {{domxref("Request.keepalive")}} {{ReadOnlyInline}}
   - : Contains the request's `keepalive` setting (`true` or `false`), which indicates whether the browser will keep the associated request alive if the page that initiated it is unloaded before the request is complete.
 - {{domxref("Request.method")}} {{ReadOnlyInline}}
diff --git a/files/en-us/web/api/request/ishistorynavigation/index.md b/files/en-us/web/api/request/ishistorynavigation/index.md
new file mode 100644
index 000000000000000..2a45ece9bc55418
--- /dev/null
+++ b/files/en-us/web/api/request/ishistorynavigation/index.md
@@ -0,0 +1,63 @@
+---
+title: "Request: isHistoryNavigation property"
+short-title: isHistoryNavigation
+slug: Web/API/Request/isHistoryNavigation
+page-type: web-api-instance-property
+browser-compat: api.Request.isHistoryNavigation
+---
+
+{{APIRef("Fetch API")}}{{AvailableInWorkers}}
+
+The **`isHistoryNavigation`** read-only property of the {{domxref("Request")}} interface is a boolean indicating whether the request is a history navigation.
+
+A history navigation is a navigation within the browser's history, made by calling {{domxref("History.go()")}}, {{domxref("History.back()")}}, {{domxref("History.forward()")}}, {{domxref("Navigation.traverseTo()")}}, {{domxref("Navigation.back()")}}, {{domxref("Navigation.forward()")}}, or directly by clicking the browser's back or forward navigation button.
+
+## Value
+
+A boolean value.
+
+## Examples
+
+This example executes in a service worker. It listens for the {{domxref("ServiceWorkerGlobalScope/fetch_event", "fetch")}} event. In the event handler, the service worker checks the `isHistoryNavigation` property to know whether the request happened because of a history navigation. If so, it attempts to respond with a cached response. If the cache does not contain a response for this request, the service worker fetches a response from the network, caches a clone of it, and responds with the network response.
+
+```js
+self.addEventListener("request", (event) => {
+  // ...
+
+  if (event.request.isHistoryNavigation) {
+    event.respondWith(
+      caches.match(event.request).then((response) => {
+        if (response !== undefined) {
+          return response;
+        } else {
+          return fetch(event.request).then((response) => {
+            let responseClone = response.clone();
+
+            caches.open("v1").then((cache) => {
+              cache.put(event.request, responseClone);
+            });
+
+            return response;
+          });
+        }
+      }),
+    );
+  }
+
+  // ...
+});
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("History API", "", "", 1)}}
+- {{domxref("Navigation API", "", "", 1)}}
+- {{domxref("Service Worker API", "", "", 1)}}
diff --git a/files/en-us/web/api/requestinit/index.md b/files/en-us/web/api/requestinit/index.md
index bff24992bb33eb2..fecd7fdb702e729 100644
--- a/files/en-us/web/api/requestinit/index.md
+++ b/files/en-us/web/api/requestinit/index.md
@@ -115,7 +115,7 @@ You can also construct a `Request` with a `RequestInit`, and pass the `Request`
 
     See [Setting headers](/en-US/docs/Web/API/Fetch_API/Using_Fetch#setting_headers) for more details.
 
-- `integrity`
+- `integrity` {{optional_inline}}
 
   - : Contains the [subresource integrity](/en-US/docs/Web/Security/Subresource_Integrity)
     value of the request.