diff --git a/docs/sources/next/examples/tutorials/_index.md b/docs/sources/next/examples/tutorials/_index.md index 5fd2698629..7501bc8401 100644 --- a/docs/sources/next/examples/tutorials/_index.md +++ b/docs/sources/next/examples/tutorials/_index.md @@ -12,7 +12,7 @@ weight: 26 - [Swagger/OpenAPI integration](https://k6.io/blog/load-testing-your-api-with-swagger-openapi-and-k6) - [Schedule k6 tests with cron](https://k6.io/blog/performance-monitoring-with-cron-and-k6) - [Load test a GraphQL service](https://k6.io/blog/load-testing-graphql-with-k6) -- [Use TypeScript in k6 scripts](https://github.com/k6io/template-typescript) +- [Use TypeScript in k6 scripts](https://grafana.com/docs/k6//using-k6/javascript-typescript-compatibility-mode/) - [Debug using a Web Proxy](https://k6.io/blog/k6-load-testing-debugging-using-a-web-proxy/) - [Distributed k6 tests on K8s](https://k6.io/blog/running-distributed-tests-on-k8s/) - [Create a k6 extension](https://k6.io/blog/extending-k6-with-xk6) diff --git a/docs/sources/next/get-started/resources.md b/docs/sources/next/get-started/resources.md index 3351a11435..01650f8d4d 100644 --- a/docs/sources/next/get-started/resources.md +++ b/docs/sources/next/get-started/resources.md @@ -14,8 +14,7 @@ These resources help you write and run k6 tests in a safe environment and explor ## Learning -- [Get started with k6 tutorial](https://grafana.com/docs/k6//examples/get-started-with-k6). The getting started tutorial provides some procedures for common real-life uses of k6 and does not require prior knowledge of k6 or JavaScript - +- [Get started with k6 tutorial](https://grafana.com/docs/k6//examples/get-started-with-k6). The getting started tutorial provides some procedures for common real-life uses of k6 and does not require prior knowledge of k6 or JavaScript. - [k6 Learn](https://github.com/grafana/k6-learn). A repository with a course and a ton of learning resources. - [k6 OSS workshop](https://github.com/grafana/k6-oss-workshop). A 2-3 hour k6 workshop with practical k6 examples using the QuickPizza demo app. - [k6 YouTube channel](https://www.youtube.com/playlist?list=PLDGkOdUX1UjrZM3lIHvFcKJxVgl2n4J65). Office hours, specific playlists, and other interesting videos from the community. @@ -43,5 +42,5 @@ Note that these are shared testing environments - please avoid high-load tests. - [Kubernetes Operator](https://k6.io/blog/running-distributed-tests-on-k8s/). Distribute test execution across a Kubernetes cluster. - [xk6 extensions](https://grafana.com/docs/k6//extensions). Custom k6 binaries to support the tool you need. - [The browser recorder](https://grafana.com/docs/k6//using-k6/test-authoring/create-tests-from-recordings/using-the-browser-recorder). Make test scripts from browser sessions. -- [k6 TypeScript template](https://github.com/grafana/k6-template-typescript) +- [Use TypeScript in k6 scripts](https://grafana.com/docs/k6//using-k6/javascript-typescript-compatibility-mode/) - [Integrations](https://grafana.com/docs/k6//misc/integrations) diff --git a/docs/sources/next/set-up/configure-k6-intellisense.md b/docs/sources/next/set-up/configure-k6-intellisense.md index d8b6ea0f2b..002647cb13 100644 --- a/docs/sources/next/set-up/configure-k6-intellisense.md +++ b/docs/sources/next/set-up/configure-k6-intellisense.md @@ -36,3 +36,4 @@ $ npm install --save-dev @types/k6 - [Visual Studio Code - k6 Extension](https://marketplace.visualstudio.com/items?itemName=k6.k6) - [IntelliJ IDEA - k6 Plugin](https://plugins.jetbrains.com/plugin/16141-k6) - [TypeScript Editor Support](https://github.com/Microsoft/TypeScript/wiki/TypeScript-Editor-Support) +- [Use TypeScript in k6 scripts](https://grafana.com/docs/k6//using-k6/javascript-typescript-compatibility-mode/) diff --git a/docs/sources/next/using-k6/javascript-compatibility-mode.md b/docs/sources/next/using-k6/javascript-typescript-compatibility-mode.md similarity index 77% rename from docs/sources/next/using-k6/javascript-compatibility-mode.md rename to docs/sources/next/using-k6/javascript-typescript-compatibility-mode.md index fa0d8ac68e..53940f56b5 100644 --- a/docs/sources/next/using-k6/javascript-compatibility-mode.md +++ b/docs/sources/next/using-k6/javascript-typescript-compatibility-mode.md @@ -1,13 +1,13 @@ --- -title: JavaScript compatibility mode -menuTitle: JavaScript mode -excerpt: 'k6 supports running test scripts with different ECMAScript compatibility modes using --compatibility-mode' -_build: - list: false +aliases: + - ./javascript-compatibility-mode/ # /docs/k6//using-k6/javascript-compatibility-mode/ +title: JavaScript and TypeScript compatibility mode +menuTitle: JavaScript and TypeScript mode +excerpt: 'k6 supports running test scripts with different ECMAScript and TypeScript compatibility modes using --compatibility-mode' weight: 19 --- -# JavaScript compatibility mode +# JavaScript and TypeScript compatibility mode You can write k6 scripts in various ECMAScript versions: @@ -20,9 +20,12 @@ To enable ES module support, k6 uses [Babel](https://babeljs.io/) internally to ![Babel transformation in k6](/media/docs/k6-oss/diagram-grafana-k6-babel-pipeline.png) -Some users prefer to bundle their test code outside k6. For this reason, k6 offers two JavaScript compatibility modes: +Additionally, k6 also has experimental support for [esbuild](https://esbuild.github.io/), to transpile TypeScript (TS) code and to support most ES6+ features. + +Some users prefer to bundle their test code outside k6. For this reason, k6 offers three JavaScript compatibility modes: - [Extended mode](#extended-mode): The default option, supporting ESM and most ES6+ features. +- [Experimental enhanced mode](#experimental-enhanced-mode): The experimental option, supporting TS and most ES6+ features. - [Base mode](#base-mode): Limited to CommonJS, excluding the Babel step. When running tests, you can change the mode by using the `--compatibility-mode` option: @@ -47,6 +50,24 @@ As illustrated in the previous diagram, if k6 detects unsupported ES+ features w Currently, the k6 Babel transformation only adds ESM support and sets `global` (node's global variable) with the value of `globalThis`. +## Experimental enhanced mode + +{{< code >}} + +```cli +$ k6 run --compatibility-mode=experimental_enhanced script.ts +``` + +```env +$ K6_COMPATIBILITY_MODE=experimental_enhanced k6 run script.ts +``` + +{{< /code >}} + +The experimental enhanced mode is similar to the extended mode, but it uses [esbuild](https://esbuild.github.io/) instead of Babel to transpile TypeScript (TS) code and to support most ES6+ features. + +TypeScript support is partial as it removes the type information but doesn't provide type safety. + ## Base mode {{< code >}} diff --git a/docs/sources/next/using-k6/modules.md b/docs/sources/next/using-k6/modules.md index d78ff62ea0..dd8abd49d6 100644 --- a/docs/sources/next/using-k6/modules.md +++ b/docs/sources/next/using-k6/modules.md @@ -355,10 +355,7 @@ $ k6 run dist/signup.bundle.js \ ## Use TypeScript -k6 does not natively support TypeScript. If you wish to write k6 tests in Typescript, you will need a bundler, as demonstrated in the previous examples: - -- Using Webpack: Refer to [k6-template-typescript](https://github.com/grafana/k6-template-typescript) and [k6-jslib-aws](https://github.com/grafana/k6-jslib-aws). -- Using Rollup: Apply the [@rollup/plugin-typescript](https://github.com/rollup/plugins/tree/master/packages/typescript) to the [k6-rollup-example](https://github.com/grafana/k6-rollup-example). +k6 supports partial TypeScript support with the `experimental_enhanced` compatibility mode. For more details, refer to [JavaScript and TypeScript compatibility mode](https://grafana.com/docs/k6//using-k6/javascript-typescript-compatibility-mode/). ## Use modules with Docker