diff --git a/files/en-us/web/api/request/destination/index.md b/files/en-us/web/api/request/destination/index.md index 2c8df25e76da334..13d822f6009c37f 100644 --- a/files/en-us/web/api/request/destination/index.md +++ b/files/en-us/web/api/request/destination/index.md @@ -10,7 +10,7 @@ browser-compat: api.Request.destination The **`destination`** read-only property of the **{{domxref("Request")}}** interface returns a string describing the type of content being requested. -The string must be one of the `audio`, `audioworklet`, `document`, `embed`, `fencedframe`, `font`, `frame`, `iframe`, `image`, `json`, `manifest`, `object`, `paintworklet`, `report`, `script`, `sharedworker`, `speculationrules`, `style`, `track`, `video`, `worker` or `xslt` strings, or the empty string, which is the default value. +The string must be one of the `audio`, `audioworklet`, `document`, `embed`, `fencedframe`, `font`, `frame`, `iframe`, `image`, `json`, `manifest`, `object`, `paintworklet`, `report`, `script`, `sharedworker`, `speculationrules`, `style`, `text`, `track`, `video`, `worker` or `xslt` strings, or the empty string, which is the default value. The `destination` is used by the {{Glossary("user agent")}} to, for example, help determine which set of rules to follow for CORS purposes, or how to navigate any complicated code paths that affect how specific types of request get handled. @@ -68,6 +68,8 @@ Possible values are: - : The target is a [speculation rules](/en-US/docs/Web/API/Speculation_Rules_API) JSON document. - `"style"` - : The target is a style +- `"text"` + - : The target is a text file. - `"track"` - : The target is an HTML {{HTMLElement("track")}}. - `"video"` diff --git a/files/en-us/web/javascript/reference/statements/import/with/index.md b/files/en-us/web/javascript/reference/statements/import/with/index.md index fffc1bb224b07c7..cc45644b560aa6e 100644 --- a/files/en-us/web/javascript/reference/statements/import/with/index.md +++ b/files/en-us/web/javascript/reference/statements/import/with/index.md @@ -74,7 +74,7 @@ For example, the code above can be written to specify that the expected type is import data from "https://example.com/data.json" with { type: "json" }; ``` -The `type` attribute allows you to specify that modules are served as JSON or CSS (and implicitly as JavaScript). +The `type` attribute allows you to specify that modules are served as JSON, CSS, or plain text (and implicitly as JavaScript). Other attributes may also be supported, and [can affect the behavior of different parts of the loading process](#intended_semantics_for_import_attributes). A syntax error is thrown if an unknown attribute is used. @@ -82,9 +82,9 @@ A syntax error is thrown if an unknown attribute is used. ### Standard attributes The available attributes depend on the language and runtime environment. -The ECMAScript standard [defines the `type` attribute with the value of `"json"`](https://tc39.es/ecma262/multipage/ecmascript-language-scripts-and-modules.html#sec-HostLoadImportedModule). +The ECMAScript standard [defines the `type` attribute with the values `"json"` and `"text"`](https://tc39.es/ecma262/multipage/ecmascript-language-scripts-and-modules.html#sec-HostLoadImportedModule). -The HTML specification also [defines the `type` attribute with values `"json"` and `"css"`](https://html.spec.whatwg.org/multipage/webappapis.html#module-type-allowed) — these are the attributes that are supported in browser environments. +The HTML specification also [defines the `type` attribute with values `"json"`, `"text"` and `"css"`](https://html.spec.whatwg.org/multipage/webappapis.html#module-type-allowed) — these are the attributes that are supported in browser environments. #### JSON Modules (`{ type: "json" }`) @@ -127,6 +127,17 @@ document.adoptedStyleSheets.push(exampleStyles); Note that importing CSS modules into workers is usually not supported, because the CSSOM specification only exposes `CSSStyleSheet` in the window context. +#### Text Modules (`{ type: "text" }`) + +The `text` type allows importing a module's source as a string value. +You can load text from a file into the `text` string using the following code: + +```js +import text from "https://example.com/file.txt" with { type: "text" }; +``` + +The file will be requested with an `{{HTTPHeader("Accept")}}: text/plain` header, but the value of the response's `{{HTTPHeader("Content-Type")}}` header is ignored, and all files are parsed as UTF-8. It can contain any textual data, even JavaScript code (which is treated as plain text). + ### Intended semantics for import attributes An attribute can change the runtime's behavior at every stage of the module loading process: @@ -139,7 +150,7 @@ An attribute can change the runtime's behavior at every stage of the module load }; ``` -- Fetching: for example, CSS modules are fetched with the [`destination`](/en-US/docs/Web/API/Request/destination) set to `"style"`, and JSON modules are fetched with `destination: "json"`. This means given the same destination URL, the server may still return different content. +- Fetching: for example, CSS modules are fetched with the [`destination`](/en-US/docs/Web/API/Request/destination) set to `"style"`, JSON modules are fetched with `destination: "json"`, and text modules are fetched with `destination: "text"`. This means given the same destination URL, the server may still return different content. - Parsing and evaluation: the runtime may use the attribute to determine how to parse and evaluate the module. ## Examples @@ -205,3 +216,4 @@ Note that, like static imports, dynamic imports are cached for the lifetime of t - [`import()`](/en-US/docs/Web/JavaScript/Reference/Operators/import) - [Import attributes proposal](https://github.com/tc39/proposal-import-attributes) - [JSON modules proposal](https://github.com/tc39/proposal-json-modules) +- [Import Text proposal](https://github.com/tc39/proposal-import-text)