v2 migration: guides/test to next (#1686)

* copy files over * Delete test.mdx * update to v2 * update sidebar * add necessary langs support * Revert "update sidebar" This reverts commit d842961. * Revert "Delete test.mdx" This reverts commit b57f64f. * move `test.mdx` to `/test/index.mdx` * reestructure content * fix aside * update links and asides * add redirects - to be tested * revise section structure * update redirects * use `astro:image` created tsconfig alias changed from md to mdx * Update setup.mdx * Create hello-tauri-webdriver.png * update aside * i18n-ko files * i18n-zh-cn files * update aside * update links to v1 api * update links * point link to main locale --------- Co-authored-by: Lorenzo Lewis <[email protected]>
tauri-apps · Dec 21, 2023 · b1541c8 · b1541c8
1 parent f862f8b
commit b1541c8
Show file tree

Hide file tree

Showing 21 changed files with 2,116 additions and 12 deletions.
diff --git a/astro.config.mjs b/astro.config.mjs
@@ -195,7 +195,7 @@ export default defineConfig({
 	],
 	markdown: {
 		shikiConfig: {
-			langs: ['powershell', 'ts', 'rust', 'bash', 'json', 'toml'],
+			langs: ['powershell', 'ts', 'rust', 'bash', 'json', 'toml', 'html', 'js'],
 		},
 		rehypePlugins: [
 			rehypeHeadingIds,
@@ -242,6 +242,32 @@ export default defineConfig({
 			'/v1/guides/development/updating-dependencies',
 			'/guides/develop/updating-dependencies'
 		),
+		// v1 /guides/testing -> /guides/test
+		...i18nRedirect(
+			'/v1/guides/testing/mocking',
+			'/guides/test/mocking'
+		),
+		...i18nRedirect(
+			'/v1/guides/testing/webdriver/ci',
+			'/guides/test/webdriver/ci'
+		),
+		...i18nRedirect(
+			'/v1/guides/testing/webdriver/introduction',
+			'/guides/test/webdriver/'
+		),
+		...i18nRedirect(
+			'/v1/guides/testing/webdriver/example/setup',
+			'/guides/test/webdriver/example/setup'
+		),
+		...i18nRedirect(
+			'/v1/guides/testing/webdriver/example/selenium',
+			'/guides/test/webdriver/example/selenium'
+		),
+		...i18nRedirect(
+			'/v1/guides/testing/webdriver/example/webdriverio',
+			'/guides/test/webdriver/example/webdriverio'
+		),
+
 		// v1 /references
 		...i18nRedirect('/v1/references', '/concepts'),
 		...i18nRedirect('/v1/references/architecture', '/concepts/architecture'),
@@ -262,10 +288,12 @@ export default defineConfig({
 		...i18nRedirect('/v1/references/security', '/concepts/development-security'),
 		...i18nRedirect('/v1/references/configuration-files', '/references/configuration-files'),
 		...i18nRedirect('/v1/references/webview-versions', '/references/webview-versions'),
+
 		// Decommissioned locales
 		'/ko/[...slug]': '/[...slug]',
 		'/it/[...slug]': '/[...slug]',
 	},
+	//
 });
 
 // Generates a redirect for each locale.
@@ -275,9 +303,9 @@ function i18nRedirect(from, to) {
 		locale === 'root'
 			? (routes[from] = to)
 			: (routes[`/${locale}/${from.replaceAll(/^\/*/g, '')}`] = `/${locale}/${to.replaceAll(
-					/^\/*/g,
-					''
-				)}`)
+				/^\/*/g,
+				''
+			)}`)
 	);
 	return routes;
 }
diff --git a/src/assets/img/guides/test/hello-tauri-webdriver.png b/src/assets/img/guides/test/hello-tauri-webdriver.png
diff --git a/src/content/docs/_ko/guides/test/index.mdx b/src/content/docs/_ko/guides/test/index.mdx
@@ -0,0 +1,14 @@
+---
+title: 테스트
+description: Tauri 런타임 내, 외부 테스트 기술
+---
+
+Tauri 런타임 내, 외부 테스트 기술
+
+import { LinkCard, CardGrid } from '@astrojs/starlight/components';
+
+<CardGrid>
+    <LinkCard title="Tauri API 모킹" href="/ko/guides/test/mocking/" />
+    <LinkCard title="WebDriver"  href="/ko/guides/test/webdriver" />
+</CardGrid>
+
diff --git a/src/content/docs/_ko/guides/test/mocking.md b/src/content/docs/_ko/guides/test/mocking.md
@@ -0,0 +1,167 @@
+---
+title: Tauri API 모킹
+sidebar:
+  order: 1
+---
+
+프런트엔드 테스트를 작성할 때 "가짜" Tauri 환경을 사용하여 창을 모의 시험하거나 IPC 호출을 가로채는 것이 일반적이며 이를 _mocking_이라고 합니다. [`@tauri-apps/api/mocks`][] 모듈은 이를 쉽게 할 수 있도록 몇 가지 도움이 되는 도구들을 제공합니다.
+
+:::caution
+
+실행 간 모의 상태 변경을 취소하려면, 각 테스트 실행 후 모킹을 지우는 것을 잊지 마십시오! 자세한 정보는 [`clearMocks()`][] 문서에서 확인할 수 있습니다.
+
+:::
+
+## IPC 요청
+
+가장 일반적으로, IPC 요청을 가로채고 싶다면, 이것은 다양한 상황에서 도움이 될 수 있습니다.
+
+- 백엔드 호출이 올바르게 이루어졌는지 확인
+- 백엔드 함수에서 다른 결과 모의 실험
+
+Tauri는 IPC 요청을 가로채는 mockIPC 기능을 제공합니다. 특정 API에 대한 상세한 정보를 원할 경우 [여기][<code>mockipc()</code>]에서 확인할 수 있습니다.
+
+:::note
+
+다음 예제는 [Vitest][]를 사용하지만 jest와 같은 다른 프런트엔드 테스트 라이브러리를 사용할 수 있습니다.
+
+:::
+
+```js
+import { beforeAll, expect, test } from "vitest";
+import { randomFillSync } from "crypto";
+
+import { mockIPC } from "@tauri-apps/api/mocks";
+import { invoke } from "@tauri-apps/api/tauri";
+
+// jsdom doesn't come with a WebCrypto implementation
+beforeAll(() => {
+  Object.defineProperty(window, 'crypto', {
+    value: {
+      // @ts-ignore      
+      getRandomValues: (buffer) => {
+        return randomFillSync(buffer);
+      },
+    },
+  });
+});
+
+
+test("invoke simple", async () => {
+  mockIPC((cmd, args) => {
+    // simulated rust command called "add" that just adds two numbers
+    if(cmd === "add") {
+      return (args.a as number) + (args.b as number);
+    }
+  });
+});
+```
+
+때때로, IPC 호출에 대한 추가 정보를 추적하려는 경우가 있습니다. 명령이 몇 번 호출되었을까? 전혀, 호출되지 않았을까? 이를 테스트를 하기 위해 [`mockIPC()`][] 와 함께 다른 탐색, 모킹 도구를 사용할 수 있습니다.
+
+```js
+import { beforeAll, expect, test, vi } from "vitest";
+import { randomFillSync } from "crypto";
+
+import { mockIPC } from "@tauri-apps/api/mocks";
+import { invoke } from "@tauri-apps/api/tauri";
+
+// jsdom doesn't come with a WebCrypto implementation
+beforeAll(() => {
+  Object.defineProperty(window, 'crypto', {
+    value: {
+      // @ts-ignore      
+      getRandomValues: (buffer) => {
+        return randomFillSync(buffer);
+      },
+    },
+  });
+});
+
+
+test("invoke", async () => {
+  mockIPC((cmd, args) => {
+    // simulated rust command called "add" that just adds two numbers
+    if(cmd === "add") {
+      return (args.a as number) + (args.b as number);
+    }
+  });
+
+  // we can use the spying tools provided by vitest to track the mocked function
+  const spy = vi.spyOn(window, "__TAURI_IPC__");
+
+  expect(invoke("add", { a: 12, b: 15 })).resolves.toBe(27);
+  expect(spy).toHaveBeenCalled();
+});
+```
+
+사이드카 또는 셸 명령에 대한 IPC 요청을 모방하려면 `spawn()`이나 `execute()`가 호출될 때 이벤트 핸들러의 ID를 가져와 이 ID를 사용하여 백엔드가 다시 보낼 이벤트를 내보내야 합니다:
+
+```js
+mockIPC(async (cmd, args) => {
+  if (args.message.cmd === 'execute') {
+    const eventCallbackId = `_${args.message.onEventFn}`;
+    const eventEmitter = window[eventCallbackId];
+
+    // 'Stdout' event can be called multiple times
+    eventEmitter({
+      event: 'Stdout',
+      payload: 'some data sent from the process',
+    });
+
+    // 'Terminated' event must be called at the end to resolve the promise
+    eventEmitter({
+      event: 'Terminated',
+      payload: {
+        code: 0,
+        signal: 'kill',
+      },
+    });
+  }
+});
+```
+
+## Windows
+
+경우에 따라 윈도우 관련 코드(예: 시작 화면 윈도우) 가 있으므로 다른 창을 모의 실험해야 합니다. 가짜 윈도우 레이블을 생성하기 위해 [`mockWindows()`][] 함수를 사용할 수 있습니다. 첫 번째 문자열은 "현재" 윈도우(예, JavaScript 스스로가 윈도우라고 믿는)를 식별하고 다른 모든 문자열은 추가 창으로 처리됩니다.
+
+:::note
+
+[`mockWindows()`][]는 실제 윈도우 속성이 아닌 윈도우의 가짜 존재입니다. 윈도우 속성을 모의실험 해보기 위해, [`mockIPC()`][]를 사용하여 올바른 호출을 가로채야 합니다.
+
+:::
+
+```js
+import { beforeAll, expect, test } from 'vitest';
+import { randomFillSync } from 'crypto';
+
+import { mockWindows } from '@tauri-apps/api/mocks';
+
+// jsdom doesn't come with a WebCrypto implementation
+beforeAll(() => {
+  Object.defineProperty(window, 'crypto', {
+    value: {
+      // @ts-ignore      
+      getRandomValues: (buffer) => {
+        return randomFillSync(buffer);
+      },
+    },
+  });
+});
+
+test('invoke', async () => {
+  mockWindows('main', 'second', 'third');
+
+  const { getCurrent, getAll } = await import('@tauri-apps/api/window');
+
+  expect(getCurrent()).toHaveProperty('label', 'main');
+  expect(getAll().map((w) => w.label)).toEqual(['main', 'second', 'third']);
+});
+```
+<!-- TODO: Updates links to v2 -->
+[`@tauri-apps/api/mocks`]: https://tauri.app/v1/api/js/mocks/
+[`mockipc()`]: https://tauri.app/v1/api/js/mocks#mockipc
+[`mockwindows()`]: https://tauri.app/v1/api/js/mocks#mockwindows
+[`clearmocks()`]: https://tauri.app/v1/api/js/mocks#clearmocks
+
+[vitest]: https://vitest.dev
diff --git a/src/content/docs/_ko/guides/test/webdriver/ci.md b/src/content/docs/_ko/guides/test/webdriver/ci.md
@@ -0,0 +1,98 @@
+---
+title: 지속적 통합
+description: WebDriver Testing
+---
+
+Linux 및 일부 프로그램을 활용하여 가짜 출력 화면을 만들어서, CI의 [`tauri-driver`][]와 함께 [WebDriver][]테스트를 실행할 수 있습니다. 다음은 우리가 [이전에 함께 구축][]한 것과 [WebdriverIO][] 예제를 사용하여 GitHub Actions 예제입니다.
+
+이것은 다음과 같은 가정을 의미합니다:
+
+1. Tauri 애플리케이션은 `cargo build --release`를 실행할 때 저장소 루트 및 바이너리 빌드에 있음.
+2. [WebDriverIO][] 테스트 러너는 `webdriver/webdriverio` 디렉토리에 있으며, `yarn test`가 해당 디렉토리 내에서 사용될 때 실행됨.
+
+다음 항목은 GitHub Actions workflow `.github/workflows/webdriver.yml` 작성된 내용입니다.
+
+```yaml
+# run this action when the repository is pushed to
+on: [push]
+
+# the name of our workflow
+name: WebDriver
+
+jobs:
+  # a single job named test
+  test:
+    # the display name of the test job
+    name: WebDriverIO Test Runner
+
+    # we want to run on the latest linux environment
+    runs-on: ubuntu-latest
+
+    # the steps our job runs **in order**
+    steps:
+      # checkout the code on the workflow runner
+      - uses: actions/checkout@v2
+
+      # install system dependencies that Tauri needs to compile on Linux.
+      # note the extra dependencies for `tauri-driver` to run which are: `webkit2gtk-driver` and `xvfb`
+      - name: Tauri dependencies
+        run: >-
+          sudo apt-get update &&
+          sudo apt-get install -y
+          libgtk-3-dev
+          libayatana-appindicator3-dev
+          libwebkit2gtk-4.0-dev
+          webkit2gtk-driver
+          xvfb
+
+      # install the latest Rust stable
+      - name: Rust stable
+        uses: actions-rs/toolchain@v1
+        with:
+          toolchain: stable
+
+      # we run our rust tests before the webdriver tests to avoid testing a broken application
+      - name: Cargo test
+        uses: actions-rs/cargo@v1
+        with:
+          command: test
+
+      # build a release build of our application to be used during our WebdriverIO tests
+      - name: Cargo build
+        uses: actions-rs/cargo@v1
+        with:
+          command: build
+          args: --release
+
+      # install the latest stable node version at the time of writing
+      - name: Node v16
+        uses: actions/setup-node@v2
+        with:
+          node-version: 16.x
+
+      # install our Node.js dependencies with Yarn
+      - name: Yarn install
+        run: yarn install
+        working-directory: webdriver/webdriverio
+
+      # install the latest version of `tauri-driver`.
+      # note: the tauri-driver version is independent of any other Tauri versions
+      - name: Install tauri-driver
+        uses: actions-rs/cargo@v1
+        with:
+          command: install
+          args: tauri-driver
+
+      # run the WebdriverIO test suite.
+      # we run it through `xvfb-run` (the dependency we installed earlier) to have a fake
+      # display server which allows our application to run headless without any changes to the code
+      - name: WebdriverIO
+        run: xvfb-run yarn test
+        working-directory: webdriver/webdriverio
+```
+
+[previously built together]: /ko/guides/test/webdriver/example/webdriverio
+
+[webdriver]: https://www.w3.org/TR/webdriver/
+[`tauri-driver`]: https://crates.io/crates/tauri-driver
+[webdriverio]: https://webdriver.io/