test(docs): update viewport docs (#28197)

Issue number: N/A

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

I needed this constant for a different PR but realized the docs were
outdated:
81714d45bd/core/src/utils/test/playwright/viewports/index.ts

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- Docs reference correct constant name 

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
This commit is contained in:
Liam DeBeasi
2023-09-19 13:37:55 -04:00
committed by GitHub
parent b5c736f5ac
commit 5ff32b7786

View File

@@ -187,17 +187,17 @@ Tests are distributed across many test runners on continuous integration (CI) to
By default, we run tests on mobile viewports only (think iPhone sized viewports). However, there are some components that have different layouts on tablet viewports. Two examples are `ion-split-pane` and the card variant of `ion-modal`.
For this scenario, developers must write tests that target the tablet viewport. This can be done by using [page.setViewportSize](https://playwright.dev/docs/api/class-page#page-set-viewport-size). The Playwright test utils directory also contains a `TabletViewport` constant which can be used to take consistent tablet-sized screenshots.
For this scenario, developers must write tests that target the tablet viewport. This can be done by using [page.setViewportSize](https://playwright.dev/docs/api/class-page#page-set-viewport-size). The Playwright test utils directory also contains a `Viewports` constant which contains some common viewport presets. Developers should feel free to add new viewports to this as is applicable.
**Example:**
```javascript
import { configs, test, TabletViewport } from '@utils/test/playwright';
import { configs, test, Viewports } from '@utils/test/playwright';
configs().forEach(({ config, title }) => {
test.describe(title('thing: rendering'), () => {
test('it should do a thing on tablet viewports', async ({ page }) => {
await page.setViewportSize(TabletViewport);
await page.setViewportSize(Viewports.tablet.portrait);
...