Skip to content

Commit

Permalink
Merge branch 'main' into i33327
Browse files Browse the repository at this point in the history
  • Loading branch information
vinhill authored Jul 23, 2024
2 parents 7690a8e + 1d32183 commit 97a3862
Show file tree
Hide file tree
Showing 28 changed files with 90 additions and 56 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ This section lists `page-type` values for pages under [Learn](/en-US/docs/Learn)
This section lists `page-type` values for pages under [Web/Accessibility](/en-US/docs/Web/Accessibility). Every page in that part of the tree must have a `page-type`, and its value must be one of those listed below or one of the [generic page type](#generic_page_types) values.

- `aria-role`: an ARIA [role](/en-US/docs/Web/Accessibility/ARIA/Roles), like [`section`](/en-US/docs/Web/Accessibility/ARIA/Roles/section_role).
- `aria-attribute`: an ARIA [attribute](eb/Accessibility/ARIA/Attributes), like [`aria-sort`](/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-sort).
- `aria-attribute`: an ARIA [attribute](/en-US/docs/Web/Accessibility/ARIA/Attributes), like [`aria-sort`](/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-sort).

### CSS page types

Expand Down Expand Up @@ -152,13 +152,13 @@ This section lists `page-type` values for pages under [Web/API](/en-US/docs/Web/

This section lists `page-type` values for pages under [WebAssembly/](/en-US/docs/WebAssembly). Every page in that part of the tree must have a `page-type`, and its value must be one of those listed below or one of the generic page type values.

- `webassembly-function`: a global function, that is a method directly under the `WebAssembly` object that acts as a namespace, like [`WebAssembly.instantiate()`](WebAssembly/JavaScript_interface/instantiate).
- `webassembly-constructor`: a constructor, like [`WebAssembly.Exception()`](WebAssembly/JavaScript_interface/Exception/Exception).
- `webassembly-interface`: a WebAssembly interface, like [`WebAssembly.LinkError`](WebAssembly/JavaScript_interface/LinkError).
- `webassembly-instance-property`: an instance property, like [`WebAssembly.Instance.exports`](WebAssembly/JavaScript_interface/Instance/exports).
- `webassembly-instance-method`: an instance method, like [`WebAssembly.Exception.getArg()`](WebAssembly/JavaScript_interface/Exception/getArg).
- `webassembly-static-method`: a static method, like [`WebAssembly.Module.exports()`](WebAssembly/JavaScript_interface/Module/exports_static).
- `webassembly-instruction`: an instruction, or a set of instructions, like [`Wrap`](WebAssembly/Reference/Numeric/Wrap).
- `webassembly-function`: a global function, that is a method directly under the `WebAssembly` object that acts as a namespace, like [`WebAssembly.instantiate()`](/en-US/docs/WebAssembly/JavaScript_interface/instantiate_static).
- `webassembly-constructor`: a constructor, like [`WebAssembly.Exception()`](/en-US/docs/WebAssembly/JavaScript_interface/Exception/Exception).
- `webassembly-interface`: a WebAssembly interface, like [`WebAssembly.LinkError`](/en-US/docs/WebAssembly/JavaScript_interface/LinkError).
- `webassembly-instance-property`: an instance property, like [`WebAssembly.Instance.exports`](/en-US/docs/WebAssembly/JavaScript_interface/Instance/exports).
- `webassembly-instance-method`: an instance method, like [`WebAssembly.Exception.getArg()`](/en-US/docs/WebAssembly/JavaScript_interface/Exception/getArg).
- `webassembly-static-method`: a static method, like [`WebAssembly.Module.exports()`](/en-US/docs/WebAssembly/JavaScript_interface/Module/exports_static).
- `webassembly-instruction`: an instruction, or a set of instructions, like [`Wrap`](/en-US/docs/WebAssembly/Reference/Numeric/Wrap).

### WebDriver page types

Expand Down
2 changes: 1 addition & 1 deletion files/en-us/mozilla/firefox/releases/4/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -403,7 +403,7 @@ Remote XUL is no longer supported; this affects XUL documents being served throu
- New `TabPinned` and `TabUnpinned` events are available, allowing you to detect when tabs are pinned and unpinned.
- The new `TabAttrModified` event is sent when a tab's `label`, `crop`, `busy`, `image`, or `selected` attributes change.
- `<xul:tab>` elements now have a `pinned` attribute, letting you determine whether or not a tab is currently pinned.
- The `setDirectionIndicator` class on `<xul:tree> elements hasn't done anything for some time now; now it's not used at all anymore.
- The `setDirectionIndicator` class on `<xul:tree>` elements hasn't done anything for some time now; now it's not used at all anymore.
- The `<xul:window>` element now has a `chromemargin` attribute that lets you set the margin between chrome and content on each side of a window; you can use this to draw into the title bar, for example.
- The `<xul:window>` element now has a `disablechrome` attribute; this is used to hide most of the chrome in a window when it's being used to display in-browser UI, such as `about:addons`.
- The `<xul:window>` element now has a `disablefastfind` attribute, which lets you disable the find bar in a window when the content doesn't support it. This is used, for example, by the add-ons panel.
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/mozilla/firefox/releases/92/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ No changes

#### Media, WebRTC, and Web Audio

- Access to audio output devices, like speakers and headphones, is now protected by the [speaker-selection](speaker-selection) feature policy ([Firefox bug 1577199](https://bugzil.la/1577199)).
- Access to audio output devices, like speakers and headphones, is now protected by the [speaker-selection](/en-US/docs/Web/HTTP/Headers/Permissions-Policy/speaker-selection) feature policy ([Firefox bug 1577199](https://bugzil.la/1577199)).

### WebDriver conformance (Marionette)

Expand Down
4 changes: 2 additions & 2 deletions files/en-us/web/api/editcontext_api/guide/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -340,7 +340,7 @@ function updateSelection(start, end) {
}
```

You can see the code for the `fromSelectionToOffsets()` function in the [converter.js](<(https://github.com/mdn/dom-examples/tree/main/edit-context/html-editor/converter.js)>) file.
You can see the code for the `fromSelectionToOffsets()` function in the [converter.js](https://github.com/mdn/dom-examples/tree/main/edit-context/html-editor/converter.js) file.

## Calculating character bounds

Expand Down Expand Up @@ -374,7 +374,7 @@ editContext.addEventListener("characterboundsupdate", (e) => {
});
```

You can see the code for the `fromOffsetsToRenderedTokenNodes()` function in the [converter.js](<(https://github.com/mdn/dom-examples/tree/main/edit-context/html-editor/converter.js)>) file.
You can see the code for the `fromOffsetsToRenderedTokenNodes()` function in the [converter.js](https://github.com/mdn/dom-examples/tree/main/edit-context/html-editor/converter.js) file.

## Applying IME composition text formats

Expand Down
2 changes: 1 addition & 1 deletion files/en-us/web/api/gputexture/createview/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,7 @@ The following criteria must be met when calling **`createView()`**, otherwise a
- `mipLevelCount` is greater than 0.
- `mipLevelCount` + `baseMipLevel` is less than or equal to {{domxref("GPUTexture.mipLevelCount")}}.
- `arrayLayerCount` is greater than 0.
- `arrayLayerCount` + `baseArrayLayer` is less than or equal to {{domxref("GPUTexture.depthOrArrayLayers")}}.
- `arrayLayerCount` + `baseArrayLayer` is less than or equal to {{domxref("GPUTexture.depthOrArrayLayers")}} if {{domxref("GPUTexture.dimension")}} is `"2d"`, or less than or equal to 1 if {{domxref("GPUTexture.dimension")}} is `"1d"` or `"3d"`.
- If `sampleCount` is greater than 1, `dimension` is `"2d"`.
- If `dimension` is:
- `"1d"`
Expand Down
17 changes: 11 additions & 6 deletions files/en-us/web/api/notification/requestpermission_static/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,24 +10,27 @@ browser-compat: api.Notification.requestPermission_static

The **`requestPermission()`** static method of the {{domxref("Notification")}} interface requests permission from the user for the current origin to display notifications.

The method returns a {{jsxref("Promise")}} that fulfills with a string indicating whether permission was granted or denied.

## Syntax

```js-nolint
// The latest spec has updated this method to a promise-based syntax that works like this:
Notification.requestPermission()
// Previously, the syntax was based on a simple callback; this version is now deprecated:
// Deprecated syntax using a callback
Notification.requestPermission(callback)
```

### Parameters

- `callback` {{optional_inline}} {{deprecated_inline}}
- : An optional callback function that is called with the permission value. Deprecated in favor of the promise return value.
- : An optional callback function that is called with the permission value.
Deprecated in favor of the {{jsxref("Promise")}} return value.

### Return value

A {{jsxref("Promise")}} that resolves to a string with the permission picked by the user. Possible values for this string are:
A {{jsxref("Promise")}} that resolves to a string with the permission picked by the user.
Possible values for this string are:

- `granted`
- : The user has explicitly granted permission for the current origin to display system notifications.
Expand All @@ -36,6 +39,8 @@ A {{jsxref("Promise")}} that resolves to a string with the permission picked by
- `default`
- : The user decision is unknown; in this case the application will act as if permission was `denied`.

The deprecated version of the method returns `undefined`

## Examples

Assume this basic HTML:
Expand All @@ -46,6 +51,8 @@ Assume this basic HTML:

It's possible to send a notification as follows — here we present a fairly verbose and complete set of code you could use if you wanted to first check whether notifications are supported, then check if permission has been granted for the current origin to send notifications, then request permission if required, before then sending a notification.

Note that the request should be made in response to user interaction: below, the method is called in the click event handler.

```js
function notifyMe() {
if (!("Notification" in window)) {
Expand Down Expand Up @@ -74,8 +81,6 @@ function notifyMe() {

We no longer show a live sample on this page, as Chrome and Firefox no longer allow notification permissions to be requested from cross-origin {{htmlelement("iframe")}}s, with other browsers to follow. To see an example in action, check out our [To-do list example](https://github.com/mdn/dom-examples/tree/main/to-do-notifications) (also see [the app running live](https://mdn.github.io/dom-examples/to-do-notifications/)).

> **Note:** In the above example we spawn notifications in response to a user gesture (clicking a button). This is not only best practice — you should not be spamming users with notifications they didn't agree to — but going forward browsers will explicitly disallow notifications not triggered in response to a user gesture. Firefox is already doing this from version 72, for example.
## Specifications

{{Specifications}}
Expand Down
7 changes: 2 additions & 5 deletions files/en-us/web/api/notifications_api/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,8 @@ The Notifications API allows web pages to control the display of system notifica

## Concepts and usage

On supported platforms, showing a system notification generally involves two things. First, the user needs to grant the current origin permission to display system notifications, which is generally done when the app or site initializes, using the {{domxref("Notification.requestPermission_static", "Notification.requestPermission()")}} method. This should be done in response to a user gesture, such as clicking a button, for example:
On supported platforms, showing a system notification generally involves two things. First, the user needs to grant the current origin permission to display system notifications, which is generally done when the app or site initializes, using the {{domxref("Notification.requestPermission_static", "Notification.requestPermission()")}} method.
This method should only be called when handling a user gesture, such as when handling a mouse click. For example:

```js
btn.addEventListener("click", () => {
Expand All @@ -24,16 +25,12 @@ btn.addEventListener("click", () => {
});
```

This is not only best practice — you should not be spamming users with notifications they didn't agree to — but going forward browsers will explicitly disallow notifications not triggered in response to a user gesture. Firefox is already doing this from version 72, for example.

This will spawn a request dialog, along the following lines:

![A dialog box asking the user to allow notifications from that origin. There are options to never allow or allow notifications.](screen_shot_2019-12-11_at_9.59.14_am.png)

From here the user can choose to allow notifications from this origin, or block them. Once a choice has been made, the setting will generally persist for the current session.

> **Note:** As of Firefox 44, the permissions for Notifications and [Push](/en-US/docs/Web/API/Push_API) have been merged. If permission is granted for notifications, push will also be enabled.
Next, a new notification is created using the {{domxref("Notification.Notification","Notification()")}} constructor. This must be passed a title argument, and can optionally be passed an options object to specify options, such as text direction, body text, icon to display, notification sound to play, and more.

In addition, the Notifications API spec specifies a number of additions to the [ServiceWorker API](/en-US/docs/Web/API/Service_Worker_API), to allow service workers to fire notifications.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -303,7 +303,7 @@ inputForm.onsubmit = (event) => {
synth.speak(utterThis);
```
In the final part of the handler, we include an {{domxref("SpeechSynthesisUtterance.pause_event", "pause")}} event to demonstrate how {{domxref("SpeechSynthesisEvent")}} can be put to good use. When {{domxref("SpeechSynthesis.pause()")}} is invoked, this returns a message reporting the character number and name that the speech was paused at.
In the final part of the handler, we include a {{domxref("SpeechSynthesisUtterance.pause_event", "pause")}} event to demonstrate how {{domxref("SpeechSynthesisEvent")}} can be put to good use. When {{domxref("SpeechSynthesis.pause()")}} is invoked, this returns a message reporting the character number and name that the speech was paused at.
```js
utterThis.onpause = (event) => {
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/web/css/css_display/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -72,4 +72,4 @@ The **CSS display** module defines how the CSS formatting box tree is generated
## See also

- [CSS flexible box layout](/en-US/docs/Web/CSS/CSS_flexible_box_layout) module
- [CSS grid layout](Web/CSS/CSS_grid_layout) module
- [CSS grid layout](/en-US/docs/Web/CSS/CSS_grid_layout) module
2 changes: 1 addition & 1 deletion files/en-us/web/css/flex/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -240,7 +240,7 @@ flexAuto.addEventListener("click", () => {

The flex container contains two flex items:

- `flex: auto` has a `flex` value of [`auto`](auto)
- `flex: auto` has a `flex` value of [`auto`](#auto)
- `flex: initial` has a `flex` value of [`initial`](#initial)

The `flex: initial` item takes up as much space as its width requires, but does not expand to take up any more space. All the remaining space is taken up by `flex: auto`.
Expand Down
4 changes: 2 additions & 2 deletions files/en-us/web/html/attributes/accept/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ When set on a file input type, the native file picker that opens up should only

{{EmbedLiveSample('Examples', '100%', 200)}}

Note the last example allows you to select multiple images. See the [`multiple`](multiple) attribute for more information.
Note the last example allows you to select multiple images. See the [`multiple`](/en-US/docs/Web/HTML/Element/input#multiple) attribute for more information.

## Unique file type specifiers

Expand Down Expand Up @@ -107,7 +107,7 @@ This produces the following output:
Regardless of the user's device or operating system, the file input provides a button that opens up a file picker dialog that allows the user to choose a file.

Including the [`multiple`](multiple) attribute, as shown above, specifies that multiple files can be chosen at once. The user can choose multiple files from the file picker in any way that their chosen platform allows (e.g. by holding down <kbd>Shift</kbd> or <kbd>Control</kbd>, and then clicking). If you only want the user to choose a single file per `<input>`, omit the `multiple` attribute.
Including the [`multiple`](/en-US/docs/Web/HTML/Element/input#multiple) attribute, as shown above, specifies that multiple files can be chosen at once. The user can choose multiple files from the file picker in any way that their chosen platform allows (e.g. by holding down <kbd>Shift</kbd> or <kbd>Control</kbd>, and then clicking). If you only want the user to choose a single file per `<input>`, omit the `multiple` attribute.

### Limiting accepted file types

Expand Down
10 changes: 10 additions & 0 deletions files/en-us/web/html/attributes/autocomplete/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -175,6 +175,16 @@ The attribute value is either the keyword `off` or `on`, or a space-separated `<
- : A URL, such as a home page or company website address as appropriate given the context of the other fields in the form.
- "`photo`"
- : The URL of an image representing the person, company, or contact information given in the other fields in the form.
- "`home`"
- : The field is for contacting someone at their residence.
- "`work`"
- : The field is for contacting someone at their work.
- "`mobile`"
- : The field is for contacting someone regardless of location.
- "`fax`"
- : Fax machine's contact details.
- "`page`"
- : Pager or beeper's contact details.
- "`webauthn`"
- : Passkeys generated by the [Web Authentication API](/en-US/docs/Web/API/Web_Authentication_API), as requested by a conditional {{domxref("CredentialsContainer.get()", "navigator.credentials.get()")}} call (i.e., one that includes `mediation: 'conditional'`). See [Sign in with a passkey through form autofill](https://web.dev/articles/passkey-form-autofill) for more details.

Expand Down
2 changes: 1 addition & 1 deletion files/en-us/web/html/attributes/max/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ browser-compat:

{{HTMLSidebar}}

The **`max`** attribute defines the maximum value that is acceptable and valid for the input containing the attribute. If the [`value`](/en-US/docs/Web/HTML/Element/input#value) of the element is greater than this, the element fails [validation](/en-US/docs/Learn/Forms/Form_validation). This value must be greater than or equal to the value of the [`min`](min) attribute. If the `max` attribute is present but is not specified or is invalid, no `max` value is applied. If the `max` attribute is valid and a non-empty value is greater than the maximum allowed by the `max` attribute, constraint validation will prevent form submission.
The **`max`** attribute defines the maximum value that is acceptable and valid for the input containing the attribute. If the [`value`](/en-US/docs/Web/HTML/Element/input#value) of the element is greater than this, the element fails [validation](/en-US/docs/Learn/Forms/Form_validation). This value must be greater than or equal to the value of the [`min`](/en-US/docs/Web/HTML/Attributes/min) attribute. If the `max` attribute is present but is not specified or is invalid, no `max` value is applied. If the `max` attribute is valid and a non-empty value is greater than the maximum allowed by the `max` attribute, constraint validation will prevent form submission.

Valid for the numeric input types, including the {{HTMLElement("input/date", "date")}}, {{HTMLElement("input/month", "month")}}, {{HTMLElement("input/week", "week")}}, {{HTMLElement("input/time", "time")}}, {{HTMLElement("input/datetime-local", "datetime-local")}}, {{HTMLElement("input/number", "number")}} and {{HTMLElement("input/range", "range")}} types, and both the {{htmlelement('progress')}} and {{htmlelement('meter')}} elements, the `max` attribute is a number that specifies the most positive value a form control to be considered valid.

Expand Down
2 changes: 1 addition & 1 deletion files/en-us/web/html/content_categories/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -296,7 +296,7 @@ The palpable elements are:
- {{HtmlElement("main")}}
- {{HtmlElement("map")}}
- {{HtmlElement("mark")}}
- {{MathMLElement("math")}} from [MathML](/en-us/doc/Web/MathML)
- {{MathMLElement("math")}} from [MathML](/en-US/docs/Web/MathML)
- {{HtmlElement("meter")}}
- {{HtmlElement("nav")}}
- {{HtmlElement("object")}}
Expand Down
2 changes: 2 additions & 0 deletions files/en-us/web/html/element/input/number/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -148,6 +148,8 @@ One issue with number inputs is that their step size is 1 by default. If you try

See that this example allows any value between `0.0` and `10.0`, with decimals to two places. For example, "9.52" is valid, but "9.521" is not.

If you want to allow arbitrary decimal values, you can set the `step` value to `"any"`.

### Controlling input size

{{HTMLElement("input")}} elements of type `number` don't support form sizing attributes such as [`size`](/en-US/docs/Web/HTML/Element/input#size). You'll have to resort to [CSS](/en-US/docs/Web/CSS) to change the size of these controls.
Expand Down
Loading

0 comments on commit 97a3862

Please sign in to comment.