docs: vitest

_plugins/docusaurus.rb

@@ -41,6 +41,15 @@ def system!(*args)
   system!("mkdir -p _site/jest/troubleshooting")
   system!("cp docusaurus/build/jest/troubleshooting/index.html _site/jest/troubleshooting")
 
+  system!("mkdir -p _site/vitest/guide")
+  system!("cp docusaurus/build/vitest/guide/index.html _site/vitest/guide")
+
+  system!("mkdir -p _site/vitest/reference")
+  system!("cp docusaurus/build/vitest/reference/index.html _site/vitest/reference")
+
+  system!("mkdir -p _site/vitest/troubleshooting")
+  system!("cp docusaurus/build/vitest/troubleshooting/index.html _site/vitest/troubleshooting")
+
   system!("mkdir -p _site/integration")
   system!("cp docusaurus/build/integration/index.html _site/integration") # redirect to /
   system!("cp docusaurus/build/index.html _site")

docusaurus/docs/cypress/troubleshooting.md

@@ -36,6 +36,8 @@ export NODE_OPTIONS=--max_old_space_size=4096
 npx knapsack-pro-jest
 
 npx knapsack-pro-cypress
+
+npx knapsack-pro-vitest
 ```
 
 ## Debug Knapsack Pro on your development environment/machine

docusaurus/docs/index.mdx

@@ -5,6 +5,7 @@ pagination_next: overview/index
 
 import api from "@site/static/img/api.png";
 import javascript from "@site/static/img/javascript.png"
+import Vitest from "@site/static/img/vitest.svg"
 import jest from "@site/static/img/jest.jpg"
 import cypress from "@site/static/img/cypress.jpg"
 import ruby from "@site/static/img/ruby.png"
@@ -20,15 +21,15 @@ If you have questions, feel free to [contact us](https://knapsackpro.com/contact
 ## Overview
 
 <div className="grid">
-<a href="/overview/" className="cell">
-<div className="cell__image"><img width="70" height="70" src={knapsack}></img></div>
+<a href="/overview/" className="cell cell--fixed">
+<span className="cell__image"><img width="70" height="70" src={knapsack}></img></span>
 <h2 className="cell__title">Knapsack Overview</h2>
 </a>
 </div>
 
 ## Libraries
 
-<div className="grid">
+<div className="grid-4">
 <a href="/knapsack_pro-ruby/guide/" className="cell">
 <div className="cell__image cell__image--ruby"><img width="60" height="60" src={ruby}></img></div>
 <h2 className="cell__title">Ruby</h2>
@@ -43,6 +44,11 @@ If you have questions, feel free to [contact us](https://knapsackpro.com/contact
 <div className="cell__image"><img width="70" height="70" src={jest}></img></div>
 <h2 className="cell__title">Jest</h2>
 </a>
+
+<a href="/vitest/guide/" className="cell">
+<div className="cell__image"><Vitest className="w-full h-auto center" /></div>
+<h2 className="cell__title">Vitest</h2>
+</a>
 </div>
 
 Can't see your language/testing framework above? [Let us know](https://docs.google.com/forms/d/e/1FAIpQLSe7Z6k__VczmRMmXykjA5i2MVEA3nEJ90gbiIeCRjecWhPOig/viewform?hl=en).
@@ -52,12 +58,12 @@ Can't see your language/testing framework above? [Let us know](https://docs.goog
 You can still use Knapsack Pro by writing your integration on top of the JavaScript SDK or using the Knapsack Pro API:
 
 <div className="grid">
-<a href="https://docs.knapsackpro.com/2020/how-to-build-native-integration-with-knapsack-pro-api-to-run-tests-in-parallel-for-any-test-runner-testing-framework" target="_blank" rel="noopener noreferrer" className="cell">
+<a href="https://docs.knapsackpro.com/2020/how-to-build-native-integration-with-knapsack-pro-api-to-run-tests-in-parallel-for-any-test-runner-testing-framework" target="_blank" rel="noopener noreferrer" className="cell cell--fixed">
 <div className="cell__image"><img width="70" height="70" src={javascript}></img></div>
 <h2 className="cell__title">JavaScript / TypeScript</h2>
 </a>
 
-<a href="https://docs.knapsackpro.com/2021/how-to-build-knapsack-pro-api-client-from-scratch-in-any-programming-language" target="_blank" rel="noopener noreferrer" className="cell">
+<a href="https://docs.knapsackpro.com/2021/how-to-build-knapsack-pro-api-client-from-scratch-in-any-programming-language" target="_blank" rel="noopener noreferrer" className="cell cell--fixed">
 <div className="cell__image"><img width="70" height="70" src={api}></img></div>
 <h2 className="cell__title">Other Language</h2>
 </a>
@@ -66,7 +72,7 @@ You can still use Knapsack Pro by writing your integration on top of the JavaScr
 ## Troubleshooting
 
 <div className="grid">
-<a href="/troubleshooting/" className="cell" style={{width: 'auto'}}>
+<a href="/troubleshooting/" className="cell cell--fixed" style={{width: 'auto'}}>
 <div className="cell__image"><img width="70" height="70" src={troubleshooting}></img></div>
 <h2 className="cell__title">Troubleshooting</h2>
 </a>

docusaurus/docs/jest/troubleshooting.md

@@ -27,6 +27,8 @@ export NODE_OPTIONS=--max_old_space_size=4096
 npx knapsack-pro-jest
 
 npx knapsack-pro-cypress
+
+npx knapsack-pro-vitest
 ```
 
 ## Debug Knapsack Pro on your development environment/machine

docusaurus/docs/overview/index.mdx

@@ -20,7 +20,7 @@ Knapsack Pro wraps your current test runner(s) and works with your existing CI i
 - Tracks your CI builds to detect bottlenecks
 - Does not have access to your source code and collects minimal test data (with opt-in encryption)
 - Enables you to export historical metrics about your CI builds
-- Supports out-of-the-box any Ruby test runners, Cypress, Jest (and provides both SDK and API to integrate with any other language)
+- Supports out-of-the-box any Ruby test runners, Cypress, Jest, Vitest (and provides both SDK and API to integrate with any other language)
 - Replaces local dependencies like Redis with an API and runs your tests regardless of network problems
 
 <Architecture className="w-full h-auto center" />

docusaurus/docs/troubleshooting/index.mdx

@@ -6,6 +6,7 @@ pagination_next: null
 import ruby from "@site/static/img/ruby.png"
 import cypress from "@site/static/img/cypress.jpg"
 import jest from "@site/static/img/jest.jpg"
+import Vitest from "@site/static/img/vitest.svg"
 
 # Troubleshooting
 
@@ -15,7 +16,7 @@ If you are utilizing two CI providers simultaneously, for example, CircleCI and
 
 ## Troubleshooting libraries
 
-<div className="grid">
+<div className="grid-4">
 <a href="/ruby/troubleshooting/" className="cell">
 <div className="cell__image cell__image--ruby"><img width="60" height="60" src={ruby}></img></div>
 <h2 className="cell__title">Ruby</h2>
@@ -30,4 +31,9 @@ If you are utilizing two CI providers simultaneously, for example, CircleCI and
 <div className="cell__image"><img width="70" height="70" src={jest}></img></div>
 <h2 className="cell__title">Jest</h2>
 </a>
+
+<a href="/vitest/troubleshooting/" className="cell">
+<div className="cell__image"><Vitest className="w-full h-auto center" /></div>
+<h2 className="cell__title">Vitest</h2>
+</a>
 </div>