From d890c3ad406027244ead2f677c01eb89029dd1f8 Mon Sep 17 00:00:00 2001 From: Kylin <1159469891@qq.com> Date: Thu, 19 Dec 2024 19:51:07 +0800 Subject: [PATCH 1/2] docs: translate browser --- guide/browser/index.md | 35 +++++++++++++++-------------------- 1 file changed, 15 insertions(+), 20 deletions(-) diff --git a/guide/browser/index.md b/guide/browser/index.md index 062d7b75..3dcdd3d6 100644 --- a/guide/browser/index.md +++ b/guide/browser/index.md @@ -8,7 +8,7 @@ outline: deep 此页面提供有关 Vitest API 中实验性浏览器模式功能的信息，该功能允许你在浏览器中本地运行测试，提供对窗口和文档等浏览器全局变量的访问。此功能目前正在开发中，API 未来可能会更改。 ::: tip -If you are looking for documentation for `expect`, `vi` or any general API like workspaces or type testing, refer to the ["Getting Started" guide](/guide/). +如果你正在寻找关于 `expect`、`vi` 或任何通用 API（如工作区或类型测试）的文档，请参阅 ["入门指南"](./guide/)。 ::: Vitest UI @@ -206,8 +206,7 @@ import { defineWorkspace } from 'vitest/config' export default defineWorkspace([ { test: { - // an example of file based convention, - // you don't have to follow it + // 文件约定的示例，你不必遵循它。 include: [ 'tests/unit/**/*.{test,spec}.ts', 'tests/**/*.unit.{test,spec}.ts', @@ -218,8 +217,7 @@ export default defineWorkspace([ }, { test: { - // an example of file based convention, - // you don't have to follow it + // 文件约定的示例，你不必遵循它。 include: [ 'tests/browser/**/*.{test,spec}.ts', 'tests/**/*.browser.{test,spec}.ts', @@ -409,14 +407,13 @@ import { render } from './my-render-function.js' test('properly handles form inputs', async () => { render() // mount DOM elements - // Asserts initial state. + // 断言初始状态。 await expect.element(page.getByText('Hi, my name is Alice')).toBeInTheDocument() - // Get the input DOM node by querying the associated label. + // 通过查询关联的标签获取输入的 DOM 节点。 const usernameInput = page.getByLabelText(/username/i) - // Type the name into the input. This already validates that the input - // is filled correctly, no need to check the value manually. + // 将名称输入到输入框中。这已经验证了输入框中的值是正确的，无需手动检查其值。 await usernameInput.fill('Bob') await expect.element(page.getByText('Hi, my name is Bob')).toBeInTheDocument() @@ -456,14 +453,13 @@ import Component from './Component.vue' test('properly handles v-model', async () => { const screen = render(Component) - // Asserts initial state. + // 断言初始状态。 await expect.element(screen.getByText('Hi, my name is Alice')).toBeInTheDocument() - // Get the input DOM node by querying the associated label. + // 通过查询关联的标签获取输入的 DOM 节点。 const usernameInput = screen.getByLabelText(/username/i) - // Type the name into the input. This already validates that the input - // is filled correctly, no need to check the value manually. + // 将名称输入到输入框中。这已经验证了输入框中的值是正确的，无需手动检查其值。 await usernameInput.fill('Bob') await expect.element(screen.getByText('Hi, my name is Bob')).toBeInTheDocument() @@ -490,14 +486,14 @@ import { render } from 'vitest-browser-react' import Fetch from './fetch' test('loads and displays greeting', async () => { - // Render a React element into the DOM + // 将一个 React 元素渲染到 DOM 中。 const screen = render() await screen.getByText('Load Greeting').click() - // wait before throwing an error if it cannot find an element + // 如果找不到元素，则等待一段时间后再抛出错误。 const heading = screen.getByRole('heading') - // assert that the alert message is correct + // 断言警告消息是正确的。 await expect.element(heading).toHaveTextContent('hello there') await expect.element(screen.getByRole('button')).toBeDisabled() }) @@ -538,12 +534,11 @@ test('shows the children when the checkbox is checked', async () => { const screen = page.elementLocator(baseElement) - // .query() will return the element or null if it cannot be found. - // .element() will return the element or throw an error if it cannot be found. + // .query() 将返回找到的元素或在未找到时返回 null。 + // .element() 会返回该元素，如果找不到该元素则会抛出错误。 expect(screen.getByText(testMessage).query()).not.toBeInTheDocument() - // The queries can accept a regex to make your selectors more - // resilient to content tweaks and changes. + // 查询可以接受正则表达式，使选择器更能适应内容的调整和变化。 await screen.getByLabelText(/show/i).click() await expect.element(screen.getByText(testMessage)).toBeInTheDocument() From 5d345d8693abf8fc36e1d16bbc085d4f37b8457b Mon Sep 17 00:00:00 2001 From: Kylin <1159469891@qq.com> Date: Sat, 21 Dec 2024 12:43:57 +0800 Subject: [PATCH 2/2] docs: adjust rows --- guide/browser/index.md | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/guide/browser/index.md b/guide/browser/index.md index 3dcdd3d6..0c856e4a 100644 --- a/guide/browser/index.md +++ b/guide/browser/index.md @@ -206,7 +206,8 @@ import { defineWorkspace } from 'vitest/config' export default defineWorkspace([ { test: { - // 文件约定的示例，你不必遵循它。 + // 文件约定的示例， + // 你不必遵循它。 include: [ 'tests/unit/**/*.{test,spec}.ts', 'tests/**/*.unit.{test,spec}.ts', @@ -217,7 +218,8 @@ export default defineWorkspace([ }, { test: { - // 文件约定的示例，你不必遵循它。 + // 文件约定的示例， + // 你不必遵循它。 include: [ 'tests/browser/**/*.{test,spec}.ts', 'tests/**/*.browser.{test,spec}.ts', @@ -413,7 +415,8 @@ test('properly handles form inputs', async () => { // 通过查询关联的标签获取输入的 DOM 节点。 const usernameInput = page.getByLabelText(/username/i) - // 将名称输入到输入框中。这已经验证了输入框中的值是正确的，无需手动检查其值。 + // 将名称输入到输入框中。 + // 这已经验证了输入框中的值是正确的，无需手动检查其值。 await usernameInput.fill('Bob') await expect.element(page.getByText('Hi, my name is Bob')).toBeInTheDocument() @@ -459,7 +462,8 @@ test('properly handles v-model', async () => { // 通过查询关联的标签获取输入的 DOM 节点。 const usernameInput = screen.getByLabelText(/username/i) - // 将名称输入到输入框中。这已经验证了输入框中的值是正确的，无需手动检查其值。 + // 将名称输入到输入框中。 + // 这已经验证了输入框中的值是正确的，无需手动检查其值。 await usernameInput.fill('Bob') await expect.element(screen.getByText('Hi, my name is Bob')).toBeInTheDocument() @@ -538,7 +542,8 @@ test('shows the children when the checkbox is checked', async () => { // .element() 会返回该元素，如果找不到该元素则会抛出错误。 expect(screen.getByText(testMessage).query()).not.toBeInTheDocument() - // 查询可以接受正则表达式，使选择器更能适应内容的调整和变化。 + // 查询可以接受正则表达式， + // 使选择器更能适应内容的调整和变化。 await screen.getByLabelText(/show/i).click() await expect.element(screen.getByText(testMessage)).toBeInTheDocument()