Merge branch 'main' into ff119_publickeycredential_deserialize2

files/en-us/learn/getting_started_with_the_web/the_web_and_web_standards/index.md

@@ -111,7 +111,7 @@ The actual syntax for HTTP messages (called requests and responses) is not that
   pElem.textContent = "We changed the text!";
   ```
 
-  In the house analogy, JavaScript is like the cooker, TV, Microwave, or hairdryer — the things that give your house useful functionality
+  In the house analogy, JavaScript is like the cooker, TV, Microwave, or hairdryer — the things that give your house useful functionality.
 
 ### Tools
 

files/en-us/learn/html/introduction_to_html/getting_started/index.md

@@ -245,22 +245,25 @@ An attribute should have:
 
 ### Active learning: Adding attributes to an element
 
-Another example of an element is {{htmlelement("a")}}. This stands for _anchor_. An anchor can make the text it encloses into a hyperlink. Anchors can take a number of attributes, but several are as follows:
+The `<img>` element can take a number of attributes, including:
 
-- `href`
-  - : This attribute's value specifies the web address for the link. For example: `href="https://www.mozilla.org/"`.
-- `title`
-  - : The `title` attribute specifies extra information about the link, such as a description of the page that is being linked to. For example, `title="The Mozilla homepage"`. This appears as a tooltip when a cursor hovers over the element.
-- `target`
-  - : The `target` attribute specifies the browsing context used to display the link. For example, `target="_blank"` will display the link in a new tab. If you want to display the linked content in the current tab, just omit this attribute.
+- `src`
+  - : The `src` attribute is a **required** attribute that specifies the location of the image. For example: `src="https://raw.githubusercontent.com/mdn/beginner-html-site/gh-pages/images/firefox-icon.png"`.
+- `alt`
+  - : The `alt` attribute specifies a text description of the image. For example: `alt="The Firefox icon"`.
+- `width`
+  - : The `width` attribute specifies the width of the image with the unit being pixels. For example: `width="300"`.
+- `height`
+  - : The `height` attribute specifies the height of the image with the unit being pixels. For example: `height="300"`.
 
-Edit the line below in the _Input_ area to turn it into a link to your favorite website.
+Edit the line below in the _Input_ area to turn it into an image.
 
-1. Add the `<a>` element.
-2. Add the `href` attribute and the `title` attribute.
-3. Specify the `target` attribute to open the link in the new tab.
+1. Find your favorite image online, right click it, and press _Copy Image Link/Address_.
+2. Back in the area below, add the `src` attribute and fill it with the link from step 1.
+3. Set the `alt` attribute.
+4. Add the `width` and `height` attributes.
 
-You will be able to see your changes live in the _Output_ area. You should see a link—that when hovered over—displays the value of the `title` attribute and, when clicked, opens a new tab and navigates to the web address in the `href` attribute. Remember that you need to include a space between the element name and between each attribute.
+You will be able to see your changes live in the _Output_ area.
 
 If you make a mistake, you can always reset it using the _Reset_ button. If you get really stuck, press the _Show solution_ button to see the answer.
 
@@ -275,7 +278,7 @@ If you make a mistake, you can always reset it using the _Reset_ button. If you
 </p>
 
 <textarea id="code" class="input" style="min-height: 100px;width: 95%">
-  &lt;p&gt;A link to my favorite website.&lt;/p&gt;
+&lt;img alt="I should be an image" &gt;
 </textarea>
 
 <div class="playable-buttons">
@@ -319,7 +322,7 @@ function updateCode() {
 }
 
 const htmlSolution =
-  '<p>A link to my <a href="https://www.mozilla.org/" title="The Mozilla homepage" target="_blank">favorite website</a>.</p>';
+  '<img src="https://raw.githubusercontent.com/mdn/beginner-html-site/gh-pages/images/firefox-icon.png" alt="Firefox icon" width="100" height="100" />';
 let solutionEntry = htmlSolution;
 
 reset.addEventListener("click", () => {
@@ -416,13 +419,13 @@ For reference, the example above also includes a non-disabled form input element
 
 ### Omitting quotes around attribute values
 
-If you look at code for a lot of other sites, you might come across a number of strange markup styles, including attribute values without quotes. This is permitted in certain circumstances, but it can also break your markup in other circumstances. For example, if we revisit our link example from earlier, we could write a basic version with _only_ the `href` attribute, like this:
+If you look at code for a lot of other sites, you might come across a number of strange markup styles, including attribute values without quotes. This is permitted in certain circumstances, but it can also break your markup in other circumstances. The element in the code snippet below, `<a>`, is called an anchor. Anchors enclose text and turn them into links. The `href` attribute specifies the web address the link points to. You can write this basic version below with _only_ the `href` attribute, like this:
 
 ```html
 <a href=https://www.mozilla.org/>favorite website</a>
 ```
 
-However, as soon as we add the `title` attribute in this way, there are problems:
+Anchors can also have a `title` attribute, a description of the linked page. However, as soon as we add the `title` in the same fashion as the `href` attribute there are problems:
 
 ```html-nolint example-bad
 <a href=https://www.mozilla.org/ title=The Mozilla homepage>favorite website</a>

files/en-us/learn/html/multimedia_and_embedding/adding_vector_graphics_to_the_web/index.md

@@ -51,9 +51,9 @@ Moreover, vector image files are much lighter than their raster equivalents, bec
 
 ## What is SVG?
 
-[SVG](/en-US/docs/Web/SVG) is an {{glossary("XML")}}-based language for describing vector images. It's basically markup, like HTML, except that you've got many different elements for defining the shapes you want to appear in your image, and the effects you want to apply to those shapes. SVG is for marking up graphics, not content. At the simplest end of the spectrum, you've got elements for creating simple shapes, like {{svgelement("circle")}} and {{svgelement("rect")}}. More advanced SVG features include {{svgelement("feColorMatrix")}} (transform colors using a transformation matrix,) {{svgelement("animate")}} (animate parts of your vector graphic,) and {{svgelement("mask")}} (apply a mask over the top of your image.)
+[SVG](/en-US/docs/Web/SVG) is an {{glossary("XML")}}-based language for describing vector images. It's basically markup, like HTML, except that you've got many different elements for defining the shapes you want to appear in your image, and the effects you want to apply to those shapes. SVG is for marking up graphics, not content. SVG defines elements for creating basic shapes, like {{svgelement("circle")}} and {{svgelement("rect")}}, as well as elements for creating more complex shapes, like {{svgelement("path")}} and {{svgelement("polygon")}}. More advanced SVG features include {{svgelement("feColorMatrix")}} (transform colors using a transformation matrix), {{svgelement("animate")}} (animate parts of your vector graphic), and {{svgelement("mask")}} (apply a mask over the top of your image).
 
-As a simple example, the following code creates a circle and a rectangle:
+As a basic example, the following code creates a circle and a rectangle:
 
 ```html
 <svg

files/en-us/learn/javascript/building_blocks/looping_code/index.md

@@ -161,7 +161,7 @@ for (const cat of cats) {
 In this example, `for (const cat of cats)` says:
 
 1. Given the collection `cats`, get the first item in the collection.
-2. Assign it to the variable `cat` and then run the code between the curly brackets `{}`.
+2. Assign it to the variable `cat` and then run the code between the curly braces `{}`.
 3. Get the next item, and repeat (2) until you've reached the end of the collection.
 
 ### map() and filter()

files/en-us/learn/javascript/first_steps/a_first_splash/index.md

@@ -426,10 +426,10 @@ This is because of the loop. The line `const fruits = ['apples', 'bananas', 'che
 A `for...of` loop gives you a way to get each item in the array and run some JavaScript on it. The line `for (const fruit of fruits)` says:
 
 1. Get the first item in `fruits`.
-2. Set the `fruit` variable to that item, then run the code between the `{}` brackets.
+2. Set the `fruit` variable to that item, then run the code between the `{}` curly braces.
 3. Get the next item in `fruits`, and repeat 2, until you reach the end of `fruits`.
 
-In this case, the code inside the brackets is writing out `fruit` to the console.
+In this case, the code inside the curly braces is writing out `fruit` to the console.
 
 Now let's look at the loop in our number guessing game — the following can be found inside the `resetGame()` function:
 

files/en-us/learn/javascript/first_steps/what_is_javascript/index.md

@@ -369,7 +369,7 @@ There are actually two modern features we can use to bypass the problem of the b
 Let's look at the difference between these two.
 
 Scripts loaded using the `async` attribute will download the script without blocking the page while the script is being fetched.
-However, once the download is complete, the script will execute, which blocks the page from rendering.
+However, once the download is complete, the script will execute, which blocks the page from rendering. This means that the rest of the content on the web page is prevented from being processed and displayed to the user until the script finishes executing.
 You get no guarantee that scripts will run in any specific order.
 It is best to use `async` when the scripts in the page run independently from each other and depend on no other script on the page.
 

files/en-us/learn/javascript/objects/basics/index.md

@@ -176,7 +176,7 @@ person.age;
 person.name.first;
 ```
 
-You can instead use brackets:
+You can instead use square brackets:
 
 ```js
 person["age"];
@@ -187,7 +187,7 @@ This looks very similar to how you access the items in an array, and it is basic
 It is no wonder that objects are sometimes called **associative arrays** — they map strings to values in the same way that arrays map numbers to values.
 
 Dot notation is generally preferred over bracket notation because it is more succinct and easier to read.
-However there are some cases where you have to use brackets.
+However there are some cases where you have to use square brackets.
 For example, if an object property name is held in a variable, then you can't use dot notation to access the value, but you can access the value using bracket notation.
 
 In the example below, the `logProperty()` function can use `person[propertyName]` to retrieve the value of the property named in `propertyName`.

files/en-us/learn/server-side/django/development_environment/index.md

@@ -325,7 +325,7 @@ Now you can create a new virtual environment with the `mkvirtualenv` command
 
 Once you've installed _virtualenvwrapper_ or _virtualenvwrapper-win_ then working with virtual environments is very similar on all platforms.
 
-Now you can create a new virtual environment with the `mkvirtualenv` command. As this command runs you'll see the environment being set up (what you see is slightly platform-specific). When the command completes the new virtual environment will be active — you can see this because the start of the prompt will be the name of the environment in brackets (below we show this for Ubuntu, but the final line is similar for Windows/macOS).
+Now you can create a new virtual environment with the `mkvirtualenv` command. As this command runs you'll see the environment being set up (what you see is slightly platform-specific). When the command completes the new virtual environment will be active — you can see this because the start of the prompt will be the name of the environment in parentheses (below we show this for Ubuntu, but the final line is similar for Windows/macOS).
 
 ```bash
 mkvirtualenv my_django_environment

files/en-us/learn/server-side/django/generic_views/index.md

@@ -308,7 +308,7 @@ The main parts of the syntax you will need to know for declaring the pattern mat
     <tr>
       <td>( )</td>
       <td>
-        Capture the part of the pattern inside the brackets. Any captured values
+        Capture the part of the pattern inside the parentheses. Any captured values
         will be passed to the view as unnamed parameters (if multiple patterns
         are captured, the associated parameters will be supplied in the order
         that the captures were declared).

files/en-us/learn/server-side/django/introduction/index.md

@@ -144,7 +144,7 @@ def index(request):
 > **Note:** A little bit of Python:
 >
 > - [Python modules](https://docs.python.org/3/tutorial/modules.html) are "libraries" of functions, stored in separate files, that we might want to use in our code. Here we import just the `HttpResponse` object from the `django.http` module so that we can use it in our view: `from django.http import HttpResponse`. There are other ways of importing some or all objects from a module.
-> - Functions are declared using the `def` keyword as shown above, with named parameters listed in brackets after the name of the function; the whole line ends in a colon. Note how the next lines are all **indented**. The indentation is important, as it specifies that the lines of code are inside that particular block (mandatory indentation is a key feature of Python, and is one reason that Python code is so easy to read).
+> - Functions are declared using the `def` keyword as shown above, with named parameters listed in parentheses after the name of the function; the whole line ends in a colon. Note how the next lines are all **indented**. The indentation is important, as it specifies that the lines of code are inside that particular block (mandatory indentation is a key feature of Python, and is one reason that Python code is so easy to read).
 
 Views are usually stored in a file called **views.py**.
 

files/en-us/learn/tools_and_testing/client-side_javascript_frameworks/svelte_getting_started/index.md

@@ -240,7 +240,7 @@ Svelte uses the [`export`](/en-US/docs/Web/JavaScript/Reference/Statements/expor
 
 ### The markup section
 
-In the markup section you can insert any HTML you like, and in addition you can insert valid JavaScript expressions inside single curly brackets (`{}`). In this case we are embedding the value of the `name` prop right after the `Hello` text.
+In the markup section you can insert any HTML you like, and in addition you can insert valid JavaScript expressions inside single curly braces (`{}`). In this case we are embedding the value of the `name` prop right after the `Hello` text.
 
 ```html
 <main>

files/en-us/learn/tools_and_testing/client-side_javascript_frameworks/svelte_typescript/index.md

@@ -818,7 +818,7 @@ Our stores have already been ported to TypeScript, but we can do better. We shou
 
 ### Understanding TypeScript generics
 
-Generics allow us to create reusable code components that work with a variety of types instead of a single type. They can be applied to interfaces, classes, and functions. Generic types are passed as parameters using a special syntax: they are specified between angle-brackets, and by convention are denoted with an upper-cased single char letter. Generic types allows us to capture the types provided by the user to be used later.
+Generics allow us to create reusable code components that work with a variety of types instead of a single type. They can be applied to interfaces, classes, and functions. Generic types are passed as parameters using a special syntax: they are specified between angle brackets, and by convention are denoted with an upper-cased single char letter. Generic types allows us to capture the types provided by the user to be used later.
 
 Let's see a quick example, a simple `Stack` class that lets us `push` and `pop` elements, like this:
 

files/en-us/mdn/writing_guidelines/howto/write_an_api_reference/index.md

@@ -313,7 +313,7 @@ Create your method pages as subpages of the interface they are implemented on. C
 
 Method pages need the following sections:
 
-1. **Title**: the title of the page must be **InterfaceName.method()** (with the two terminal parentheses), but the slug (the end of the page URL) must not include the brackets. Also the interface name must start with a capital. Although an interface is implemented in JavaScript on the prototype of objects, we don't put `.prototype.` in the title, like we do in the [JavaScript reference](/en-US/docs/Web/JavaScript/Reference).
+1. **Title**: the title of the page must be **InterfaceName.method()** (with the two terminal parentheses), but the slug (the end of the page URL) must not include the parentheses. Also the interface name must start with a capital. Although an interface is implemented in JavaScript on the prototype of objects, we don't put `.prototype.` in the title, like we do in the [JavaScript reference](/en-US/docs/Web/JavaScript/Reference).
 2. **\\{{APIRef}}**: Include the \\{{APIRef}} macro in the first line of each method page, including the name of the API as an argument, so for example \\{{APIRef("Web Audio API")}}. This macro serves to construct a reference menu on the left-hand side of the interface page, including properties and methods, and other quick links as defined in the [GroupData](https://github.com/mdn/content/blob/main/files/jsondata/GroupData.json) macro (ask someone to add your API to an existing GroupData entry, or to create a new one, if it isn't already listed there). The menu will look something like the below screenshot.
    ![This screenshot shows a vertical navigation menu for the OscillatorNode interface, with multiple sublists for methods and properties, as generated by the APIRef macro ](apiref-links.png)
 3. **Standardization status**: Next, the banner indicating the standardization status should be added (these can be placed on the same line as the \\{{APIRef}} macro):

files/en-us/mozilla/add-ons/webextensions/api/declarativenetrequest/rulecondition/index.md

@@ -71,7 +71,7 @@ Domains specified in `initiatorDomains`, `excludedInitiatorDomains`, `requestDom
 - The entries must consist of only _lowercase_ ASCII characters.
 - Use [Punycode](https://en.wikipedia.org/wiki/Punycode) encoding for internationalized domains.
 - IPv4 addresses must be represented as 4 numbers separated by a dot.
-- IPv6 addresses should be represented in their canonical form, wrapped in brackets.
+- IPv6 addresses should be represented in their canonical form, wrapped in square brackets.
 
 To programmatically generate the canonical domain for a URL, use the [URL API](/en-US/docs/Web/API/URL) and read its `hostname` property, i.e., `new URL(url).hostname`.
 

files/en-us/mozilla/add-ons/webextensions/manifest.json/optional_permissions/index.md

@@ -27,8 +27,7 @@ browser-compat: webextensions.manifest.optional_permissions
         <pre class="brush: json">
 "optional_permissions": [
   "webRequest"
-]</pre
-        >
+]</pre>
       </td>
     </tr>
   </tbody>
@@ -61,14 +60,17 @@ You can include any of the following here, but not in all browsers: check the co
 - `background`
 - `bookmarks`
 - `browserSettings`
+- `browsingData`
 - `clipboardRead`
 - `clipboardWrite`
 - `contentSettings`
 - `contextMenus`
 - `cookies`
 - `debugger`
-- `devtools`
+- `declarativeNetRequest`
 - `declarativeNetRequestFeedback`
+- `declarativeNetRequestWithHostAccess`
+- `devtools`
 - `downloads`
 - `downloads.open`
 - `find`
@@ -79,8 +81,11 @@ You can include any of the following here, but not in all browsers: check the co
 - `nativeMessaging`
 - `notifications`
 - `pageCapture`
+- `pkcs11`
 - `privacy`
+- `proxy`
 - `scripting`
+- `sessions`
 - `tabHide`
 - `tabs`
 - `topSites`