Add Docker command examples to all Doc Detective guides (#113)

* Initial plan

* Add Docker instructions to all guides with Doc Detective commands

Co-authored-by: hawkeyexl <[email protected]>

* Fix Vale linting issues in MDX files

Co-authored-by: hawkeyexl <[email protected]>

* Revert Vale config and add Docker example for remote tests

Co-authored-by: hawkeyexl <[email protected]>

---------

Co-authored-by: copilot-swe-agent[bot] <[email protected]>
Co-authored-by: hawkeyexl <[email protected]>

Author: Copilot

docs/get-started/actions/checkLink.mdx

@@ -7,6 +7,8 @@ grand_parent: Tests,
 description: Check if a URL returns an acceptable status code from a GET request.
 ---
 
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 import { schemas } from "doc-detective-common";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
 
@@ -175,10 +177,27 @@ Consider the following test configuration, which checks the validity of `https:/
 
 To run the test, use the following command:
 
+<Tabs>
+  <TabItem value="npx" label="NPX" default>
+
 ```bash
 npx doc-detective -i bad-certificate.json
 ```
 
+  </TabItem>
+  <TabItem value="docker" label="Docker">
+
+```bash
+docker run -v .:/app docdetective/docdetective -i /app/bad-certificate.json
+```
+
+:::note
+The `-v` argument mounts your current directory (`.`) to `/app` in the container.
+:::
+
+  </TabItem>
+</Tabs>
+
 This command executes the test, but it fails, returning the following response:
 
 ```json

docs/get-started/create-your-first-test.md renamed to docs/get-started/create-your-first-test.mdx

@@ -2,6 +2,9 @@
 sidebar_label: Create your first test
 ---
 
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
 # Create your first test
 
 In this tutorial, you will create a basic test that navigates to a webpage, validates the presence of specific elements, and captures a screenshot. This will introduce you to fundamental Doc Detective actions that are essential for creating more advanced tests in the future.
@@ -77,11 +80,28 @@ To create your first test, follow these steps:
 
 5. In your terminal, enter the following command to run the test:
 
+   <Tabs>
+     <TabItem value="npx" label="NPX" default>
+
    ```bash
    npx doc-detective --input homepage-check.spec.json
    ```
 
-   By default, Doc Detective scans the current directory for valid tests, but you can specify your test file using the `--input` argument. For more information, see [Run tests](/docs/get-started/sample-tests.md#run-tests).
+     </TabItem>
+     <TabItem value="docker" label="Docker">
+
+   ```bash
+   docker run -v .:/app docdetective/docdetective --input /app/homepage-check.spec.json
+   ```
+
+   :::note
+   The `-v` argument mounts your current directory (`.`) to `/app` in the container, giving Doc Detective access to your test specification and enabling it to output results and screenshots.
+   :::
+
+     </TabItem>
+   </Tabs>
+
+   By default, Doc Detective scans the current directory for valid tests, but you can specify your test file using the `--input` argument. For more information, see [Run tests](/docs/get-started/sample-tests#run-tests).
 
 ## Outcome
 

docs/get-started/inputs/custom.mdx

@@ -4,6 +4,9 @@ title: Custom inputs
 description: Define custom input formats and markup patterns for your documentation.
 ---
 
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
 # Custom input formats
 
 You can define custom input formats and extend existing formats by modifying your [configuration file](/docs/references/schemas/config). This allows you to support new file types or customize test detection for your specific documentation patterns.
@@ -39,12 +42,12 @@ To define a custom file type, add an entry to the `fileTypes` array in your conf
 
 **Optional properties for inline tests:**
 
-- `testStartStatementOpen`: Pattern that starts a test declaration (e.g., `"<!-- test "`)
-- `testStartStatementClose`: Pattern that ends a test declaration (e.g., `" -->"`)
-- `testEndStatementOpen`: Pattern that marks the end of a test (e.g., `"<!-- test end"`)
-- `testEndStatementClose`: Pattern that closes the test end marker (e.g., `" -->"`)
-- `stepStatementOpen`: Pattern that starts a step declaration (e.g., `"<!-- step "`)
-- `stepStatementClose`: Pattern that ends a step declaration (e.g., `" -->"`)
+- `testStartStatementOpen`: Pattern that starts a test declaration (for example, `"<!-- test "`)
+- `testStartStatementClose`: Pattern that ends a test declaration (for example, `" -->"`)
+- `testEndStatementOpen`: Pattern that marks the end of a test (for example, `"<!-- test end"`)
+- `testEndStatementClose`: Pattern that closes the test end marker (for example, `" -->"`)
+- `stepStatementOpen`: Pattern that starts a step declaration (for example, `"<!-- step "`)
+- `stepStatementClose`: Pattern that ends a step declaration (for example, `" -->"`)
 - `testIgnoreStatement`: Pattern for ignoring blocks
 
 **Optional properties for detected tests:**
@@ -261,10 +264,27 @@ To test your custom patterns:
 3. Run Doc Detective with the `--input` flag pointing to your file
 4. Check the generated test results to verify patterns were detected correctly
 
+<Tabs>
+  <TabItem value="npx" label="NPX" default>
+
 ```bash
 npx doc-detective --input sample.cdoc --config custom-config.json
 ```
 
+  </TabItem>
+  <TabItem value="docker" label="Docker">
+
+```bash
+docker run -v .:/app docdetective/docdetective --input /app/sample.cdoc --config /app/custom-config.json
+```
+
+:::note
+The `-v` argument mounts your current directory (`.`) to `/app` in the container.
+:::
+
+  </TabItem>
+</Tabs>
+
 ## Best practices
 
 - **Start with basics**: Begin with basic patterns and add complexity as needed

docs/get-started/intro.md renamed to docs/get-started/intro.mdx

@@ -3,17 +3,35 @@ title: Introduction
 sidebar_label: Introduction
 ---
 
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
 # Doc Detective
 
 Validate your content with Doc Detective:
 
+<Tabs>
+  <TabItem value="npx" label="NPX" default>
+
 ```bash
 npx doc-detective
 ```
 
-Want to use the Docker image? [Check it out](https://github.com/doc-detective/docker-image).
+  </TabItem>
+  <TabItem value="docker" label="Docker">
+
+```bash
+docker run -v .:/app docdetective/docdetective
+```
+
+:::note
+The `-v` argument mounts your current directory (`.`) to `/app` in the container, giving Doc Detective access to your test specifications.
+:::
+
+  </TabItem>
+</Tabs>
 
-See the [Installation](/docs/get-started/installation) guide to get started. Come chat on [Discord](https://discord.gg/uAfSjVH7yr)!
+See the [Installation](/docs/get-started/installation) guide to get started. Come chat on [Discord](https://discord.gg/uAfSjVH7yr).
 
 ## What's Doc Detective?
 

docs/get-started/sample-tests.md renamed to docs/get-started/sample-tests.mdx

@@ -1,6 +1,9 @@
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
 # Explore sample tests
 
-Use the sample test files provided to experiment with Doc Detective’s capabilities and see how it handles different scenarios.
+Use the sample test files provided to experiment with Doc Detective's capabilities and see how it handles different scenarios.
 
 ## Get sample files
 
@@ -14,46 +17,131 @@ npm i
 
 ## Run tests
 
+<Tabs>
+  <TabItem value="npx" label="NPX" default>
+
 ```bash
 npx doc-detective
 ```
 
+  </TabItem>
+  <TabItem value="docker" label="Docker">
+
+```bash
+docker run -v .:/app docdetective/docdetective
+```
+
+:::note
+The `-v` argument mounts your current directory (`.`) to `/app` in the container, giving Doc Detective access to your test specifications.
+:::
+
+  </TabItem>
+</Tabs>
+
 By default, Doc Detective scans the current directory for valid tests, but you can specify your test file with the `--input` argument. For example, to run tests in a file named `doc-content-inline-tests.md`, run the following command:
 
+<Tabs>
+  <TabItem value="npx" label="NPX" default>
+
 ```bash
 npx doc-detective --input doc-content-inline-tests.md
 ```
 
+  </TabItem>
+  <TabItem value="docker" label="Docker">
+
+```bash
+docker run -v .:/app docdetective/docdetective --input /app/doc-content-inline-tests.md
+```
+
+  </TabItem>
+</Tabs>
+
 If you have test files in multiple directories or want to specify multiple files, then enter them separated with commas:
 
+<Tabs>
+  <TabItem value="npx" label="NPX" default>
+
 ```bash
 npx doc-detective --input doc-content-inline-tests.md,/apis/api-tests.md
 ```
 
+  </TabItem>
+  <TabItem value="docker" label="Docker">
+
+```bash
+docker run -v .:/app docdetective/docdetective --input /app/doc-content-inline-tests.md,/app/apis/api-tests.md
+```
+
+  </TabItem>
+</Tabs>
+
 To customize your test, file type, and directory options, create a `.doc-detective.json` [config](/docs/references/schemas/config) file. If a `.doc-detective.json` file exists in the directory when you run the comment, Doc Detective loads the config. Otherwise, you can specify a config path with the `--config` argument.
 
+<Tabs>
+  <TabItem value="npx" label="NPX" default>
+
 ```bash
 npx doc-detective --config .doc-detective.json
 ```
 
+  </TabItem>
+  <TabItem value="docker" label="Docker">
+
+```bash
+docker run -v .:/app docdetective/docdetective --config /app/.doc-detective.json
+```
+
+  </TabItem>
+</Tabs>
+
 **Note**: All paths are relative to the current working directory, regardless of the config file's location.
 
 You can override config options with command-line arguments. For example, to run tests in a file named `tests.spec.json`, even if that isn't included in your config, run the following command:
 
+<Tabs>
+  <TabItem value="npx" label="NPX" default>
+
 ```bash
 npx doc-detective --config .doc-detective.json --input tests.spec.json
 ```
 
-<!-- ### Run remotely hosted tests
+  </TabItem>
+  <TabItem value="docker" label="Docker">
+
+```bash
+docker run -v .:/app docdetective/docdetective --config /app/.doc-detective.json --input /app/tests.spec.json
+```
+
+  </TabItem>
+</Tabs>
+
+### Remotely hosted tests
 
 You can run tests hosted remotely by specifying the URL of the test file with the `--input` argument. For example, to run tests from a file hosted at `https://doc-detective.com/sample.spec.json`, run the following command:
 
+<Tabs>
+  <TabItem value="npx" label="NPX" default>
+
 ```bash
 npx doc-detective --input https://doc-detective.com/sample.spec.json
 ```
 
+  </TabItem>
+  <TabItem value="docker" label="Docker">
+
+```bash
+docker run docdetective/docdetective --input https://doc-detective.com/sample.spec.json
+```
+
+:::note
+The `-v` argument is not necessary for remotely hosted tests since Docker doesn't need access to local files.
+:::
+
+  </TabItem>
+</Tabs>
+
 These tests run the same way as local tests, but Doc Detective fetches the test file from the specified URL and stores it in a temporary directory. The URL must be accessible to the machine running the tests.
- -->
 
 ## Next steps