Skip to content

Commit

Permalink
Merge branch 'main' into 7566-replace-alert-tutorial
Browse files Browse the repository at this point in the history
  • Loading branch information
evelinabe authored Jul 4, 2024
2 parents 03a091f + ff7a033 commit 60c5046
Show file tree
Hide file tree
Showing 4 changed files with 112 additions and 1 deletion.
13 changes: 13 additions & 0 deletions files/en-us/mozilla/firefox/releases/128/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -68,10 +68,23 @@ This article provides information about the changes in Firefox 128 that affect d

#### General

- We now support the extended "unhandledPromptBehavior" capability which can either be a string (WebDriver classic) or a JSON object (WebDriver BiDi). The object type offers more capabilities for WebDriver BiDi like handling "beforeunload" prompts. ([Firefox bug 1884650](https://bugzil.la/1884650))

#### WebDriver BiDi

- Added support for the "BiDi flag" of a WebDriver Session to align with the WebDriver BiDi specification. This allows to identify sessions created for or upgraded to WebDriver BiDi. ([Firefox bug 1898719](https://bugzil.la/1898719))
- Added support for several arguments for the `network.continueRequest` command, which now allows to modify headers, cookies, method and body of a request before it is sent over the network. ([Firefox bug 1850680](https://bugzil.la/1850680))
- Added support for the `userContext` argument in the `permissions.setPermission` command, which allows to isolate a permission to a specific user context (implemented as containers in Firefox). ([Firefox bug 1894217](https://bugzil.la/1894217))
- Fixed a bug in `browsingContext.navigate` where a navigation error would load an error page and cause subsequent commands to fail. ([Firefox bug 1878690](https://bugzil.la/1878690))
- We fixed the order in which `network.responseCompleted` events are emitted for redirects. The original request's `responseCompleted` is now always emitted before the events for the redirect. ([Firefox bug 1879580](https://bugzil.la/1879580))
- To align with the current Firefox behavior, we introduced the workaround to not partition cookies which are added with the "storage.setCookie" command for the same domain as the page loaded in the targeted context. ([Firefox bug 1898222](https://bugzil.la/1898222))
- The `input.setFiles` command has been updated to throw an `UnsupportedOperation` error if the specified file does not exist. ([Firefox bug 1887644](https://bugzil.la/1887644))

#### Marionette

- Added support for the "HTTP flag" of a WebDriver Session to align with the WebDriver classic specification. This allows to identify sessions created for WebDriver classic. ([Firefox bug 1884090](https://bugzil.la/1884090))
- Added support for the Permissions API in WebDriver Classic. ([Firefox bug 1524074](https://bugzil.la/1524074))

## Changes for add-on developers

- Adds the ability to enable and disable rules in static declarative net request rulesets with {{WebExtAPIRef("declarativeNetRequest.updateStaticRules")}} and list disabled rules for a static ruleset with {{WebExtAPIRef("declarativeNetRequest.getDisabledRuleIds")}} ([Firefox bug 1810762](https://bugzil.la/1810762))
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/web/css/css_functions/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -202,7 +202,7 @@ The {{CSSxRef("color_value","<color>")}} CSS [data type](/en-US/docs/Web/C
- {{CSSxRef("color_value/color-contrast", "color-contrast()")}} {{Experimental_Inline}}
- : Selects the highest color contrast from a list of colors, compare to a base color value.
- {{CSSxRef("color_value/device-cmyk", "device-cmyk()")}} {{Experimental_Inline}}
- : Defines CMYK colors in a device-independent way.
- : Defines CMYK colors in a device-dependent way.
- {{CSSXref("color_value/light-dark", "light-dark()")}} {{Experimental_Inline}}
- : Returns one of two provided colors based on the current color scheme.

Expand Down
49 changes: 49 additions & 0 deletions files/en-us/web/css/filter-function/hue-rotate/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@ browser-compat: css.types.filter-function.hue-rotate

The **`hue-rotate()`** [CSS](/en-US/docs/Web/CSS) [function](/en-US/docs/Web/CSS/CSS_Functions) rotates the [hue](https://en.wikipedia.org/wiki/Hue) of an element and its contents. Its result is a {{cssxref("<filter-function>")}}.

> **Note:** `hue-rotate()` is specified as a matrix operation on the RGB color. It does not actually convert the color to the HSL model, which is a non-linear operation. Therefore, it may not preserve the saturation or lightness of the original color, especially for saturated colors.
{{EmbedInteractiveExample("pages/css/function-hue-rotate.html")}}

## Syntax
Expand Down Expand Up @@ -174,6 +176,53 @@ This example shows three images: the image with a `hue-rotate()` filter function

{{EmbedLiveSample('With_url()_and_the_SVG_hue-rotate_filter','100%','280')}}

### hue-rotate() does not preserve saturation or lightness

The diagram below compares two color gradients starting with red: the first is generated using `hue-rotate()`, and the second uses actual HSL color values. Note how the `hue-rotate()` gradient shows obvious differences in saturation and lightness in the middle.

```html
<div>
<p>Using <code>hue-rotate()</code></p>
<div id="hue-rotate"></div>
</div>
<div>
<p>Using <code>hsl()</code></p>
<div id="hsl"></div>
</div>
```

```css hidden
#hue-rotate,
#hsl {
display: flex;
margin: 1em 0;
}

#hue-rotate div,
#hsl div {
width: 2px;
height: 100px;
}
```

```js
const hueRotate = document.getElementById("hue-rotate");
const hsl = document.getElementById("hsl");

for (let i = 0; i < 360; i++) {
const div1 = document.createElement("div");
div1.style.backgroundColor = `hsl(${i}, 100%, 50%)`;
hsl.appendChild(div1);

const div2 = document.createElement("div");
div2.style.backgroundColor = "red";
div2.style.filter = `hue-rotate(${i}deg)`;
hueRotate.appendChild(div2);
}
```

{{EmbedLiveSample('hue-rotate_does_not_preserve_saturation_or_lightness','100%','350')}}

## Specifications

{{Specifications}}
Expand Down
49 changes: 49 additions & 0 deletions files/en-us/web/css/filter-function/saturate/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@ browser-compat: css.types.filter-function.saturate

The **`saturate()`** [CSS](/en-US/docs/Web/CSS) [function](/en-US/docs/Web/CSS/CSS_Functions) super-saturates or desaturates the input image. Its result is a {{cssxref("&lt;filter-function&gt;")}}.

> **Note:** `saturate()` is specified as a matrix operation on the RGB color. It does not actually convert the color to the HSL model, which is a non-linear operation. Therefore, it may not preserve the hue or lightness of the original color.
{{EmbedInteractiveExample("pages/css/function-saturate.html")}}

## Syntax
Expand All @@ -33,6 +35,53 @@ saturate(100%) /* No effect */
saturate(200%) /* Double saturation */
```

### saturate() does not preserve hue or lightness

The diagram below compares two color gradients with `hsl(0, 50%, 50%)` as the mid-point: the first is generated using `saturate()`, and the second uses actual HSL color values. Note how the `saturate()` gradient shows differences in hue and lightness towards the two ends.

```html
<div>
<p>Using <code>saturate()</code></p>
<div id="saturate"></div>
</div>
<div>
<p>Using <code>hsl()</code></p>
<div id="hsl"></div>
</div>
```

```css hidden
#saturate,
#hsl {
display: flex;
margin: 1em 0;
}

#saturate div,
#hsl div {
width: 2px;
height: 100px;
}
```

```js
const saturate = document.getElementById("saturate");
const hsl = document.getElementById("hsl");

for (let i = 0; i <= 200; i++) {
const div1 = document.createElement("div");
div1.style.backgroundColor = `hsl(0, ${i / 2}%, 50%)`;
hsl.appendChild(div1);

const div2 = document.createElement("div");
div2.style.backgroundColor = "hsl(0, 50%, 50%)";
div2.style.filter = `saturate(${i}%)`;
saturate.appendChild(div2);
}
```

{{EmbedLiveSample('saturate_does_not_preserve_hue_or_lightness','100%','350')}}

## Specifications

{{Specifications}}
Expand Down

0 comments on commit 60c5046

Please sign in to comment.