Update Testing Libraries naming in docs

.vscode/markdown.code-snippets

@@ -27,7 +27,7 @@
 			"",
 			"<!--Native-->",
 			"```js",
-			"import { $1 } from 'dom-testing-library'",
+			"import { $1 } from '@testing-library/dom'",
 			"",
 			"const container = document.body",
 			"const $3 = $1(container, '$2')",
@@ -50,4 +50,4 @@
 		],
 		"description": "Create a Docusaurus multi-language code block"
 	}
-}
+}

README.md

@@ -8,7 +8,7 @@ testing-library-docs
 [![Code of Conduct][coc-badge]][coc]
 <!-- prettier-ignore-end -->
 
-Documentation site for [react-testing-library](https://github.com/testing-library/react-testing-library), [dom-testing-library](https://github.com/testing-library/dom-testing-library), and [related projects](https://github.com/testing-library)
+Documentation site for [react-testing-library](https://github.com/testing-library/react-testing-library), [DOM Testing Library](https://github.com/testing-library/dom-testing-library), and [related projects](https://github.com/testing-library)
 
 See [./website/README.md](./website/README.md) for instructions on building the site
 

docs/angular-testing-library/intro.md

@@ -76,7 +76,7 @@ after each interaction.
 You can also import these event via `@angular-extensions/testing-library`, but
 the Angular's change detection will not be triggered automatically.
 
-The same counts for all the queries provided by `dom-testing-library`, these are
+The same counts for all the queries provided by `DOM Testing Library`, these are
 also re-exported and can be imported via `@angular-extensions/testing-library`.
 
 ```typescript

docs/bs-react-testing-library/intro.md

@@ -11,7 +11,7 @@ Bindings for several testing libraries have been ported to [ReasonML][re].
 `react-testing-library`.
 
 [`bs-dom-testing-library`][gh-dom] contains [BuckleScript][bs] bindings for
-`dom-testing-library`.
+`DOM Testing Library`.
 
 ```
 npm install --save-dev bs-dom-testing-library

docs/cypress-testing-library/intro.md

@@ -22,9 +22,9 @@ Add this line to your project's `cypress/support/commands.js`:
 import 'cypress-testing-library/add-commands';
 ```
 
-You can now use all of `dom-testing-library`'s `getBy`, `getAllBy`, `queryBy`
+You can now use all of `DOM Testing Library`'s `getBy`, `getAllBy`, `queryBy`
 and `queryAllBy` commands.
-[See `dom-testing-library` API for reference](dom-testing-library/api-queries.md)
+[See `DOM Testing Library` API for reference](dom-testing-library/api-queries.md)
 
 ## Examples
 
@@ -45,9 +45,9 @@ cy.get('form').then(subject => {
 ```
 
 `cypress-testing-library` supports both jQuery elements and DOM nodes. This is
-necessary because Cypress uses jQuery elements, while `dom-testing-library`
+necessary because Cypress uses jQuery elements, while `DOM Testing Library`
 expects DOM nodes. When you pass a jQuery element as `container`, it will get
 the first DOM node from the collection and use that as the `container` parameter
-for the `dom-testing-library` functions.
+for the `DOM Testing Library` functions.
 
 [gh]: https://github.com/testing-library/cypress-testing-library

docs/dom-testing-library/api-configuration.md

@@ -28,7 +28,7 @@ Defaults to `data-testid`. See [`getByTestId`](#getbytestid).
 
 ```js
 // setup-tests.js
-import { configure } from 'dom-testing-library'
+import { configure } from '@testing-library/dom'
 
 configure({testIdAttribute: 'my-data-test-id'})`
 ```

docs/dom-testing-library/api-helpers.md

@@ -5,15 +5,15 @@ title: Helpers
 
 ## Custom Queries
 
-`dom-testing-library` exposes many of the helper functions that are used to
+`DOM Testing Library` exposes many of the helper functions that are used to
 implement the default queries. You can use the helpers to build custom queries.
 For example, the code below shows a way to override the default `testId` queries
 to use a different data-attribute. (Note: test files would import
-`test-utils.js` instead of using `dom-testing-library` directly).
+`test-utils.js` instead of using `DOM Testing Library` directly).
 
 ```js
 // test-utils.js
-const domTestingLib = require('dom-testing-library')
+const domTestingLib = require('@testing-library/dom')
 const { queryHelpers } = domTestingLib
 
 export const queryByTestId = queryHelpers.queryByAttribute.bind(
@@ -116,7 +116,7 @@ could do:
 <!--Native-->
 
 ```js
-import { within } from 'dom-testing-library'
+import { within } from '@testing-library/dom'
 
 const { getByText } = within(document.getElementById('messages'))
 const helloMessage = getByText('hello')

docs/dom-testing-library/api-queries.md

@@ -107,7 +107,7 @@ The example below will find the input node for the following DOM structures:
 <!--Native-->
 
 ```javascript
-import { getByLabelText } from 'dom-testing-library'
+import { getByLabelText } from '@testing-library/dom'
 
 const container = document.body
 const inputNode = getByLabelText(container, 'Username')
@@ -172,7 +172,7 @@ matches the given [`TextMatch`](#textmatch).
 <!--Native-->
 
 ```js
-import { getByPlaceholderText } from 'dom-testing-library'
+import { getByPlaceholderText } from '@testing-library/dom'
 
 const container = document.body
 const inputNode = getByPlaceholderText(container, 'Username')
@@ -229,7 +229,7 @@ matching the given [`TextMatch`](#textmatch).
 <!--Native-->
 
 ```js
-import { getByText } from 'dom-testing-library'
+import { getByText } from '@testing-library/dom'
 
 const container = document.body
 const aboutAnchorNode = getByText(container, /about/i)
@@ -305,7 +305,7 @@ as it's deprecated).
 <!--Native-->
 
 ```js
-import { getByAltText } from 'dom-testing-library'
+import { getByAltText } from '@testing-library/dom'
 
 const container = document.body
 const incrediblesPosterImg = getByAltText(container, /incredibles.*? poster/i)
@@ -360,7 +360,7 @@ Will also find a `title` element within an SVG.
 <!--Native-->
 
 ```js
-import { getByTitle } from 'dom-testing-library'
+import { getByTitle } from '@testing-library/dom'
 
 const container = document.body
 const deleteElement = getByTitle(container, 'Delete')
@@ -419,7 +419,7 @@ document.getElementById('lastName').value = 'Norris'
 <!--Native-->
 
 ```js
-import { getByDisplayValue } from 'dom-testing-library'
+import { getByDisplayValue } from '@testing-library/dom'
 
 const container = document.body
 const lastNameInput = getByDisplayValue(container, 'Norris')
@@ -457,7 +457,7 @@ document.getElementById('messageTextArea').value = 'Hello World'
 <!--Native-->
 
 ```js
-import { getByDisplayValue } from 'dom-testing-library'
+import { getByDisplayValue } from '@testing-library/dom'
 
 const container = document.body
 const messageTextArea = getByDisplayValue(container, 'Hello World')
@@ -499,7 +499,7 @@ matches the given [`TextMatch`](#textmatch).
 <!--Native-->
 
 ```js
-import { getByDisplayValue } from 'dom-testing-library'
+import { getByDisplayValue } from '@testing-library/dom'
 
 const container = document.body
 const selectElement = getByDisplayValue(container, 'Alaska')
@@ -549,7 +549,7 @@ accepts a [`TextMatch`](#textmatch)).
 <!--Native-->
 
 ```js
-import { getByRole } from 'dom-testing-library'
+import { getByRole } from '@testing-library/dom'
 
 const container = document.body
 const dialogContainer = getByRole(container, 'dialog')
@@ -599,7 +599,7 @@ also accepts a [`TextMatch`](#textmatch)).
 <!--Native-->
 
 ```js
-import { getByTestId } from 'dom-testing-library'
+import { getByTestId } from '@testing-library/dom'
 
 const container = document.body
 const usernameInput = getByTestId(container, 'username-input')
@@ -632,7 +632,7 @@ cy.getByTestId('username-input').should('exist')
 
 #### Overriding `data-testid`
 
-The `...ByTestId` functions in `dom-testing-library` use the attribute
+The `...ByTestId` functions in `DOM Testing Library` use the attribute
 `data-testid` by default, following the precedent set by
 [React Native Web](https://github.com/testing-library/react-testing-library/issues/1)
 which uses a `testID` prop to emit a `data-testid` attribute on the element, and
@@ -661,7 +661,7 @@ affect the precision of string matching:
 
 ### Normalization
 
-Before running any matching logic against text in the DOM, `dom-testing-library`
+Before running any matching logic against text in the DOM, `DOM Testing Library`
 automatically normalizes that text. By default, normalization consists of
 trimming whitespace from the start and end of text, and collapsing multiple
 adjacent whitespace characters into a single space.

docs/dom-testing-library/cheatsheet.md

@@ -3,7 +3,7 @@ id: cheatsheet
 title: Cheatsheet
 ---
 
-A short guide to all the exported functions in `dom-testing-library`
+A short guide to all the exported functions in `DOM Testing Library`
 
 ## Queries
 

docs/dom-testing-library/example-intro.md

@@ -15,7 +15,7 @@ import {
   // Tip: all queries are also exposed on an object
   // called "queries" which you could import here as well
   wait,
-} from 'dom-testing-library'
+} from '@testing-library/dom'
 // adds special assertions like toHaveTextContent
 import 'jest-dom/extend-expect'
 

docs/dom-testing-library/install.md

@@ -8,7 +8,7 @@ This module is distributed via [npm][npm] which is bundled with [node][node] and
 should be installed as one of your project's `devDependencies`:
 
 ```
-npm install --save-dev dom-testing-library
+npm install --save-dev @testing-library/dom
 ```
 
 ## Wrappers
@@ -21,29 +21,29 @@ wrapper:
 
 ## Ecosystem
 
-`dom-testing-library` works well with these companion libraries:
+`DOM Testing Library` works well with these companion libraries:
 
 - [user-event](ecosystem-user-event.md) browser event simulation
 - [jest-dom](ecosystem-jest-dom.md) custom Jest matchers
 
 ## Main Exports
 
 You can
-[review the `dom-testing-library` package.json here](https://unpkg.com/dom-testing-library/package.json).
+[review the `DOM Testing Library` package.json here](https://unpkg.com/@testing-library/dom/package.json).
 
 In particular, the `main`, `module`, and `umd:main` fields are useful. Each of
 these points to a file that's useful in certain situations. Typically, your
 testing framework will resolve to the correct one for your situation, but if it
 does not, then you can either configure your testing framework to resolve to the
-right file when you require/import `dom-testing-library` or you can import the
+right file when you require/import `@testing-library/dom` or you can import the
 file you need more explicitly. For example:
 
 ```js
-import { within } from 'dom-testing-library/dist/dom-testing-library.umd.js'
+import { within } from '@testing-library/dom/dist/@testing-library/dom.umd.js'
 ```
 
 You can
-[review the published `dist` files here](https://unpkg.com/dom-testing-library/dist).
+[review the published `dist` files here](https://unpkg.com/@testing-library/dom/dist/).
 
 The `main` file is configured to compile down to support the version of node
 that is referenced in the `package.json` `engines.node` field. But the `module`

docs/dom-testing-library/intro.md

@@ -14,12 +14,12 @@ functionality) don't break your tests and slow you and your team down.
 
 ## This solution
 
-The `dom-testing-library` is a very light-weight solution for testing DOM nodes
+The `DOM Testing Library` is a very light-weight solution for testing DOM nodes
 (whether simulated with [`JSDOM`](https://github.com/jsdom/jsdom) as provided by
 default with [Jest][jest] or in the browser). The main utilities it provides
 involve querying the DOM for nodes in a way that's similar to how the user finds
 elements on the page. In this way, the library helps ensure your tests give you
-confidence in your UI code. The `dom-testing-library`'s primary guiding
+confidence in your UI code. The `DOM Testing Library`'s primary guiding
 principle is:
 
 > [The more your tests resemble the way your software is used, the more confidence they can give you.](guiding-principles.md)

docs/dom-testing-library/setup.md

@@ -5,8 +5,8 @@ sidebar_label: Setup
 ---
 
 If you're running your tests in the browser bundled with webpack (or similar)
-then `dom-testing-library` should work out of the box for you. However, most
-people using `dom-testing-library` are using it with
+then `DOM Testing Library` should work out of the box for you. However, most
+people using `DOM Testing Library` are using it with
 [the Jest testing framework](https://jestjs.io/) with the `testEnvironment` set
 to
 [`jest-environment-jsdom`](https://www.npmjs.com/package/jest-environment-jsdom)

docs/ecosystem-native-testing-library.md

@@ -5,9 +5,9 @@ sidebar_label: native-testing-library
 ---
 
 Native Testing Library is a testing library for **React Native** inspired by
-`dom-testing-library`. Because React Native does not run in a browser
+`DOM Testing Library`. Because React Native does not run in a browser
 environment, the core queries are implemented independently, unlike other
-wrappers that user dom-testing-library as the base. You'll find much more
+wrappers that use `DOM Testing Library` as the base. You'll find much more
 information about the library, including examples, on the project website:
 
 - [Docs](https://native-testing-library.com)

docs/intro.md

@@ -18,7 +18,7 @@ slow you and your team down.
 
 ## This solution
 
-The core library, [`dom-testing-library`][dom], is a light-weight solution for
+The core library, [`DOM Testing Library`][dom], is a light-weight solution for
 testing web pages by querying and interacting with DOM nodes (whether simulated
 with [`JSDOM`][jsdom]/[Jest][jest] or in the browser). The main utilities it
 provides involve querying the DOM for nodes in a way that's similar to how the
@@ -36,7 +36,7 @@ is also a plugin to use testing-library queries for end-to-end tests in
 1.  A test runner or framework
 2.  Specific to a testing framework
 
-`dom-testing-library` works with any environment that provides DOM APIs, such as
+`DOM Testing Library` works with any environment that provides DOM APIs, such as
 Jest, Mocha + JSDOM, or a real browser
 
 [jest]: https://jestjs.io

docs/native-testing-library/intro.md

@@ -5,9 +5,9 @@ sidebar_label: Intro
 ---
 
 Native Testing Library is a testing library for **React Native** inspired by
-`dom-testing-library`. Because React Native does not run in a browser
+`DOM Testing Library`. Because React Native does not run in a browser
 environment, the core queries are implemented independently, unlike other
-wrappers that use `dom-testing-library` as the base. You'll find much more
+wrappers that use `DOM Testing Library` as the base. You'll find much more
 information about the library, including examples, on the project sites:
 
 - [Docs][docs]
@@ -41,14 +41,14 @@ write tests using that philosophy in React Native.
 the testing library API as closely as possible while still accounting for the
 differences in the platforms. Accomplishing this is no small feat because of the
 differences between the two platforms. Although most framework implementations
-like `react-testing-library` are thin layers over `dom-testing-library`, this
+like `react-testing-library` are thin layers over `DOM Testing Library`, this
 library needed to have its own base implementation as well as a user-facing API.
 This library uses the
 [react-test-renderer](https://reactjs.org/docs/test-renderer.html), whereas
-`dom-testing-library` uses ReactDOM and JSDOM. The main philosophy is that you
+`DOM Testing Library` uses ReactDOM and JSDOM. The main philosophy is that you
 should find elements that are on the "screen" the way users would. This approach
 is meant to give you confidence that your app is working as a cohesive unit.
-Just like the `dom-testing-library`, `native-testing-library`'s primary guiding
+Just like the `DOM Testing Library`, `native-testing-library`'s primary guiding
 principle is:
 
 > [The more your tests resemble the way your software is used, the more confidence they can give you.](guiding-principles.md)