diff --git a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/index.ts b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/index.ts
index 2a3026e7cc..91fe97bf92 100644
--- a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/index.ts
+++ b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/index.ts
@@ -22,4 +22,5 @@ export { default as ScheduleRow } from "./schedule-row/ScheduleRow.svelte";
 export { default as TestflowNavigator } from "./testflow-navigator/TestflowNavigator.svelte";
 export { default as TestDataRow } from "./test-data-row/TestDataRow.svelte";
 export { default as RequestAssertionsTestFlow } from "./request-tests/RequestAssertionsTestFlow.svelte";
+export { default as RequestTestsTestFlow } from "./request-tests/RequestTestsTestFlow.svelte";
 export { default as ResponseTestResults } from "./test-results-panel/ResponseTestResults.svelte";
diff --git a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-navigator/RequestNavigatorTestFlow.svelte b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-navigator/RequestNavigatorTestFlow.svelte
index 2c13895b52..e18d1e1e50 100644
--- a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-navigator/RequestNavigatorTestFlow.svelte
+++ b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-navigator/RequestNavigatorTestFlow.svelte
@@ -55,6 +55,11 @@
         id: RequestSectionEnum.AUTHORIZATION,
         count: 0,
       },
+      {
+        name: "Scripts",
+        id: RequestSectionEnum.TESTS,
+        count: 0,
+      },
       {
         name: "Assertions",
         id: RequestSectionEnum.ASSERTIONS,
diff --git a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/RequestTestsTestFlow.svelte b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/RequestTestsTestFlow.svelte
new file mode 100644
index 0000000000..92a543ee0e
--- /dev/null
+++ b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/RequestTestsTestFlow.svelte
@@ -0,0 +1,133 @@
+<script lang="ts">
+  import { TestCaseModeEnum } from "@sparrow/common/types/workspace";
+  import { Button } from "@sparrow/library/ui";
+  import { Script, PreScript } from "./sub-components";
+
+  export let tests;
+  export let onTestsChange;
+  export let tabSplitDirection = "horizontal";
+  export let onGenerateTestCases = undefined;
+  export let onGeneratePreScript = undefined;
+  export let isTestCasesGenerating = false;
+  export let isPreScriptGenerating = false;
+</script>
+
+<div
+  class="d-flex flex-column w-100 h-100"
+  style="position: relative;"
+  id="request-tab-test"
+>
+  <div
+    class="d-flex flex-column align-items-center justify-content-between w-100"
+  >
+    <div
+      class="response-container d-flex align-items-center pb-1 px-0 justify-content-between w-100 z-1"
+    >
+      <div class="d-flex gap-1 align-items-center justify-content-center">
+        <div
+          class="position-relative d-flex align-items-center rounded mb-0 py-1"
+          style="position: relative;"
+        >
+          <span
+            role="button"
+            class="rounded text-fs-12 border-radius-2 px-2 py-1 btn-formatter"
+            style="position: relative; z-index: 2; background-color: {tests?.testCaseMode ===
+            TestCaseModeEnum.NO_CODE
+              ? 'var(--bg-ds-surface-400)'
+              : 'transparent'}"
+            id="request-tab-nocode"
+            on:click={() => {
+              onTestsChange({
+                ...tests,
+                testCaseMode: TestCaseModeEnum.NO_CODE,
+              });
+            }}
+          >
+            Pre-Request Script
+          </span>
+
+          <span
+            role="button"
+            on:click={() => {
+              onTestsChange({
+                ...tests,
+                testCaseMode: TestCaseModeEnum.SCRIPT,
+              });
+            }}
+            id="request-tab-test-script"
+            class="rounded px-2 text-fs-12 py-1 btn-formatter"
+            style="position: relative; z-index: 2; background-color: {tests?.testCaseMode ===
+            TestCaseModeEnum.SCRIPT
+              ? 'var(--bg-ds-surface-400)'
+              : 'transparent'}"
+          >
+            Post-Request Script
+          </span>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="border rounded-top">
+    {#if tests?.testCaseMode === TestCaseModeEnum.SCRIPT}
+      <div class="px-3 py-2">
+        <p class="text-fs-12 mb-0 text-muted">JavaScript Code</p>
+      </div>
+    {:else if tests?.testCaseMode === TestCaseModeEnum.NO_CODE}
+      <div class="d-flex align-items-center justify-content-between px-3 py-2">
+        <p class="text-fs-12 mb-0 text-muted">JavaScript Code</p>
+        <Button
+          title="Read Documentation"
+          size={"extra-small"}
+          type="link-secondary"
+          onClick={() => {
+            window.open(
+              "https://docs.sparrowapp.dev/api-testing/rest/pre-request-script",
+              "_blank",
+            );
+          }}
+        />
+      </div>
+    {/if}
+  </div>
+
+  <div style="flex:1; overflow:auto;">
+    {#if tests?.testCaseMode === TestCaseModeEnum.SCRIPT}
+      <Script
+        {tabSplitDirection}
+        {tests}
+        {onTestsChange}
+        {onGenerateTestCases}
+        {isTestCasesGenerating}
+      />
+    {:else}
+      <PreScript
+        {tabSplitDirection}
+        {tests}
+        {onTestsChange}
+        {onGeneratePreScript}
+        {isPreScriptGenerating}
+      />
+    {/if}
+  </div>
+</div>
+
+<style>
+  .btn-formatter {
+    background-color: transparent;
+    border: none;
+    cursor: pointer;
+    font-family: "Inter", sans-serif;
+    font-weight: 500;
+    color: var(--text-ds-neutral-50);
+    transition: background-color 0.2s ease;
+  }
+
+  .btn-formatter:hover {
+    background-color: var(--bg-ds-surface-500);
+  }
+
+  .text-muted {
+    color: var(--text-ds-neutral-500);
+  }
+</style>
diff --git a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/index.ts b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/index.ts
index d6f89fe5ab..0529e8234a 100644
--- a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/index.ts
+++ b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/index.ts
@@ -1 +1,3 @@
 export { default as NoCode } from "./no-code/NoCode.svelte";
+export { default as PreScript } from "./pre-script/PreScript.svelte";
+export { default as Script } from "./script/Script.svelte";
diff --git a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/pre-script/PreScript.svelte b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/pre-script/PreScript.svelte
new file mode 100644
index 0000000000..451e49b1a5
--- /dev/null
+++ b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/pre-script/PreScript.svelte
@@ -0,0 +1,374 @@
+<script lang="ts">
+  import { Editor, Search, Input } from "@sparrow/library/forms";
+  import {
+    SearchIcon2,
+    ChevronDownRegular,
+    ChevronUpRegular,
+  } from "@sparrow/library/icons";
+  import { Button, Tooltip } from "@sparrow/library/ui";
+  import { predefinedTestSnippets } from "./utils/common-snippets";
+  import { SparkleColoredIcon, SparkleFilledIcon } from "@sparrow/common/icons";
+  import { tick, onDestroy } from "svelte";
+
+  export let onTestsChange;
+  export let tests;
+  export let onGeneratePreScript = undefined;
+  export let isPreScriptGenerating = false;
+
+  type EditorLanguage = "PreTestJavaScript";
+
+  interface Snippet {
+    title: string;
+    function: string;
+  }
+  export let lang: EditorLanguage = "PreTestJavaScript";
+  export let isBodyBeautified: boolean = false;
+
+  let searchData: string = "";
+  let testCasePrompt = "";
+  let errorMessage: string = "";
+  let isError: boolean = false;
+  let isSnippetDropdownOpen: boolean = false;
+  let snippetDropdownElement: HTMLElement;
+
+  // Preprocess search string
+  $: trimmedSearch = searchData.trim().toLowerCase();
+
+  // Filtered snippets
+  $: filteredSnippets = !trimmedSearch
+    ? predefinedTestSnippets
+    : predefinedTestSnippets.filter((s: Snippet) =>
+        s.title.toLowerCase().includes(trimmedSearch),
+      );
+
+  const toggleSnippetDropdown = () => {
+    isSnippetDropdownOpen = !isSnippetDropdownOpen;
+  };
+
+  const handleClickOutside = (event: MouseEvent) => {
+    if (
+      snippetDropdownElement &&
+      !snippetDropdownElement.contains(event.target as Node)
+    ) {
+      isSnippetDropdownOpen = false;
+    }
+  };
+
+  $: if (typeof window !== "undefined") {
+    if (isSnippetDropdownOpen) {
+      document.addEventListener("click", handleClickOutside);
+    } else {
+      document.removeEventListener("click", handleClickOutside);
+    }
+  }
+
+  onDestroy(() => {
+    if (typeof window !== "undefined") {
+      document.removeEventListener("click", handleClickOutside);
+    }
+  });
+
+  const updateBeautifiedState = (val: boolean): void => {
+    isBodyBeautified = val;
+  };
+
+  const handleCodeMirrorChange = (e: any) => {
+    const newContent = e.detail;
+    onTestsChange({ ...tests, preScript: newContent });
+  };
+
+  const selectSnippet = (data: string): void => {
+    let value = tests?.preScript || "";
+    const newValue = value ? `${value}\n${data}` : data;
+    onTestsChange({ ...tests, preScript: newValue });
+  };
+
+  const highlightMatch = (text: string, searchTerm: string): string => {
+    if (!searchTerm.trim()) return text;
+    const regex = new RegExp(
+      `(${searchTerm.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")})`,
+      "gi",
+    );
+    return text.replace(regex, '<mark class="search-highlight">$1</mark>');
+  };
+
+  const handleGenerateTestCases = async () => {
+    if (onGeneratePreScript) {
+      const result = await onGeneratePreScript(testCasePrompt);
+      if (result?.error) {
+        isError = true;
+        errorMessage = "Failed to generate script. Please try again.";
+      } else if (result?.generatedContent) {
+        isError = false;
+        errorMessage = "";
+        testCasePrompt = "";
+        // Append generated content to existing script
+        const currentScript = tests?.preScript || "";
+        const separator = currentScript ? "\n\n" : "";
+        const newScript = currentScript + separator + result.generatedContent;
+        onTestsChange({ ...tests, preScript: newScript });
+      }
+    }
+  };
+</script>
+
+<div
+  class="border border-top-0 text-light p-2 h-100 rounded-bottom position-relative"
+>
+  <div class="d-flex h-100 flex-column">
+    <!-- Editor Area -->
+    <div
+      class="editor-container"
+      style="flex:1 1 auto; overflow:hidden; min-height:0;"
+    >
+      <Editor
+        bind:lang
+        value={tests?.preScript || ""}
+        on:change={handleCodeMirrorChange}
+        isEditable={true}
+        autofocus={true}
+        placeholder={`// What are the Pre-Request tests?\n// It runs before your request is sent. Use them to set variables, headers, prepare data.\n// For example: Need a timestamp for every request?\n// sp.environment.set("timestamp", new Date());\n// sp.request.headers.set("Auth-Token", "12345");\n\n// You can:\n// - Use "Snippets" to insert common Pre-Requests\n// - Type a prompt and click "Generate" to create a Pre-Request using AI\n// - Or, write Pre-Requests manually using scripting`}
+        {isBodyBeautified}
+        beautifySyntaxCallback={updateBeautifiedState}
+      />
+    </div>
+
+    <!-- Bottom Bar with Snippets Dropdown and AI Input -->
+    <div
+      class="bottom-bar d-flex align-items-center"
+      style="flex:0 0 auto; margin-top:8px; gap:8px;"
+    >
+      <!-- Snippets Dropdown (Left) -->
+      <div
+        class="snippet-dropdown-container"
+        bind:this={snippetDropdownElement}
+      >
+        <Button
+          onClick={toggleSnippetDropdown}
+          size="small"
+          type={isSnippetDropdownOpen ? "primary" : "outline-secondary"}
+          title={"Snippets"}
+          endIcon={isSnippetDropdownOpen
+            ? ChevronUpRegular
+            : ChevronDownRegular}
+        />
+
+        {#if isSnippetDropdownOpen}
+          <div class="snippet-dropdown-menu">
+            <!-- Search -->
+            <div class="dropdown-search-container">
+              <Search
+                id="script-snippet-search"
+                variant="primary"
+                size="small"
+                bind:value={searchData}
+                placeholder="Search snippets"
+              />
+            </div>
+
+            <!-- Snippets List -->
+            <div class="dropdown-snippets-list">
+              {#if filteredSnippets.length > 0}
+                {#each filteredSnippets as snippet}
+                  <div
+                    class="snippet-item"
+                    tabindex="0"
+                    role="button"
+                    on:click={() => {
+                      selectSnippet(snippet.function);
+                      isSnippetDropdownOpen = false;
+                    }}
+                    on:keydown={(e) => {
+                      if (e.key === "Enter" || e.key === " ") {
+                        e.preventDefault();
+                        selectSnippet(snippet.function);
+                        isSnippetDropdownOpen = false;
+                      }
+                    }}
+                  >
+                    <p class="snippet-item-text">
+                      {@html highlightMatch(snippet.title, searchData)}
+                    </p>
+                  </div>
+                {/each}
+              {:else if trimmedSearch}
+                <div class="no-results">
+                  <div
+                    class="d-flex justify-content-center align-items-center"
+                    style="margin-bottom: 8px;"
+                  >
+                    <SearchIcon2
+                      width={"20px"}
+                      height={"20px"}
+                      color={"var(--bg-ds-neutral-300)"}
+                    />
+                  </div>
+                  <p class="no-results-text">
+                    No result found for "{searchData}"
+                  </p>
+                </div>
+              {/if}
+            </div>
+          </div>
+        {/if}
+      </div>
+
+      <!-- AI Input (Right) -->
+      <div class="ai-input-container" style="flex: 1;">
+        {#if errorMessage}
+          <div class="input-error">{errorMessage}</div>
+        {/if}
+        <div style="position: relative;">
+          <div class="input-with-button">
+            <Input
+              id="sparkle-input-pre"
+              placeholder="Ask AI to generate a Pre-Request"
+              startIcon={SparkleColoredIcon}
+              iconSize={16}
+              variant="secondary"
+              size="medium"
+              bind:value={testCasePrompt}
+              {isError}
+              disabled={isPreScriptGenerating}
+              on:input={() => {
+                isError = false;
+                errorMessage = "";
+              }}
+            />
+          </div>
+          <div
+            style="position: absolute; right: 8px; top: 50%; transform: translateY(-50%);"
+          >
+            <Button
+              size="small"
+              type="outline-secondary"
+              startIcon={isPreScriptGenerating
+                ? SparkleFilledIcon
+                : SparkleColoredIcon}
+              title={"Generate"}
+              disable={isPreScriptGenerating || isError}
+              loading={isPreScriptGenerating}
+              onClick={() => {
+                if (!isPreScriptGenerating && testCasePrompt.trim()) {
+                  handleGenerateTestCases();
+                } else if (!testCasePrompt.trim()) {
+                  isError = true;
+                  errorMessage = "Please enter a prompt before generating.";
+                }
+              }}
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<style>
+  .input-with-button :global(input) {
+    padding-right: 120px !important;
+  }
+
+  .input-error {
+    color: var(--text-ds-danger-300, #e74c3c);
+    font-size: 12px;
+    margin-bottom: 4px;
+    text-align: left;
+  }
+
+  .bottom-bar {
+    padding-top: 8px;
+  }
+
+  .snippet-dropdown-container {
+    position: relative;
+  }
+
+  .snippet-dropdown-menu {
+    position: absolute;
+    bottom: 100%;
+    left: 0;
+    margin-bottom: 8px;
+    width: 320px;
+    max-height: 400px;
+    background-color: var(--bg-ds-surface-800);
+    border: 1px solid var(--border-ds-neutral-400);
+    border-radius: 8px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
+    display: flex;
+    flex-direction: column;
+    z-index: 1000;
+  }
+
+  .dropdown-search-container {
+    padding: 12px;
+    border-bottom: 1px solid var(--border-ds-neutral-400);
+  }
+
+  .dropdown-snippets-list {
+    flex: 1;
+    overflow-y: auto;
+    padding: 8px;
+  }
+
+  .snippet-item {
+    padding: 8px 12px;
+    cursor: pointer;
+    border-radius: 4px;
+    transition: all 0.2s ease;
+    margin-bottom: 4px;
+  }
+
+  .snippet-item:hover {
+    background-color: var(--bg-ds-surface-600);
+  }
+
+  .snippet-item:active {
+    background-color: var(--bg-ds-surface-500);
+  }
+
+  .snippet-item:focus-visible {
+    outline: none;
+    background-color: var(--bg-ds-surface-600);
+    border: 2px solid var(--bg-ds-primary-300);
+  }
+
+  .snippet-item-text {
+    font-family: "Inter", sans-serif;
+    font-weight: 500;
+    font-size: 12px;
+    color: var(--text-ds-primary-300);
+    margin: 0;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .no-results {
+    padding: 24px 16px;
+    text-align: center;
+  }
+
+  .no-results-text {
+    font-weight: 500;
+    font-size: 12px;
+    color: var(--text-ds-neutral-300);
+    margin: 0;
+  }
+
+  :global(.search-highlight) {
+    background-color: transparent;
+    color: var(--text-ds-neutral-50);
+    padding: 1px 2px;
+    border-radius: 2px;
+    font-weight: 600;
+  }
+
+  .editor-container {
+    width: 100%;
+  }
+
+  .ai-input-container {
+    position: relative;
+  }
+</style>
diff --git a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/pre-script/utils/common-snippets.ts b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/pre-script/utils/common-snippets.ts
new file mode 100644
index 0000000000..6d1760abd3
--- /dev/null
+++ b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/pre-script/utils/common-snippets.ts
@@ -0,0 +1,22 @@
+export const predefinedTestSnippets = [
+  {
+    title: "Get Environment Variables",
+    function: `sp.global.get("url");`,
+  },
+  {
+    title: "Set Environment Variables",
+    function: `sp.global.set("url", "https://jsonplaceholder.typicode.com/todos");`,
+  },
+  {
+    title: "Get Local Variables",
+    function: `sp.environment.get("url");`,
+  },
+  {
+    title: "Set Local Variables",
+    function: `sp.environment.set("url", "https://jsonplaceholder.typicode.com/todos");`,
+  },
+  {
+    title: "Set Timestamp Variables",
+    function: `sp.environment.set("timestamp", new Date());`,
+  },
+];
diff --git a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/script/Script.svelte b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/script/Script.svelte
new file mode 100644
index 0000000000..af47d1e93c
--- /dev/null
+++ b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/script/Script.svelte
@@ -0,0 +1,374 @@
+<script lang="ts">
+  import { Editor, Search, Input } from "@sparrow/library/forms";
+  import {
+    SearchIcon2,
+    ChevronDownRegular,
+    ChevronUpRegular,
+  } from "@sparrow/library/icons";
+  import { Button, Tooltip } from "@sparrow/library/ui";
+  import { predefinedTestSnippets } from "./utils/common-snippets";
+  import { SparkleColoredIcon, SparkleFilledIcon } from "@sparrow/common/icons";
+  import { tick, onDestroy } from "svelte";
+
+  export let onTestsChange;
+  export let tests;
+  export let onGenerateTestCases = undefined;
+  export let isTestCasesGenerating = false;
+
+  type EditorLanguage = "TestJavaScript";
+
+  interface Snippet {
+    title: string;
+    function: string;
+  }
+  export let lang: EditorLanguage = "TestJavaScript";
+  export let isBodyBeautified: boolean = false;
+
+  let searchData: string = "";
+  let testCasePrompt = "";
+  let errorMessage: string = "";
+  let isError: boolean = false;
+  let isSnippetDropdownOpen: boolean = false;
+  let snippetDropdownElement: HTMLElement;
+
+  // Preprocess search string
+  $: trimmedSearch = searchData.trim().toLowerCase();
+
+  // Filtered snippets
+  $: filteredSnippets = !trimmedSearch
+    ? predefinedTestSnippets
+    : predefinedTestSnippets.filter((s: Snippet) =>
+        s.title.toLowerCase().includes(trimmedSearch),
+      );
+
+  const updateBeautifiedState = (val: boolean): void => {
+    isBodyBeautified = val;
+  };
+
+  const handleCodeMirrorChange = (e: any) => {
+    const newContent = e.detail;
+    onTestsChange({ ...tests, script: newContent });
+  };
+
+  const selectSnippet = (data: string): void => {
+    let value = tests?.script || "";
+    const newValue = value ? `${value}\n${data}` : data;
+    onTestsChange({ ...tests, script: newValue });
+  };
+
+  const highlightMatch = (text: string, searchTerm: string): string => {
+    if (!searchTerm.trim()) return text;
+    const regex = new RegExp(
+      `(${searchTerm.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")})`,
+      "gi",
+    );
+    return text.replace(regex, '<mark class="search-highlight">$1</mark>');
+  };
+
+  const toggleSnippetDropdown = () => {
+    isSnippetDropdownOpen = !isSnippetDropdownOpen;
+  };
+
+  const handleClickOutside = (event: MouseEvent) => {
+    if (
+      snippetDropdownElement &&
+      !snippetDropdownElement.contains(event.target as Node)
+    ) {
+      isSnippetDropdownOpen = false;
+    }
+  };
+
+  $: if (typeof window !== "undefined") {
+    if (isSnippetDropdownOpen) {
+      document.addEventListener("click", handleClickOutside);
+    } else {
+      document.removeEventListener("click", handleClickOutside);
+    }
+  }
+
+  onDestroy(() => {
+    if (typeof window !== "undefined") {
+      document.removeEventListener("click", handleClickOutside);
+    }
+  });
+
+  const handleGenerateTestCases = async () => {
+    if (onGenerateTestCases) {
+      const result = await onGenerateTestCases(testCasePrompt);
+      if (result?.error) {
+        isError = true;
+        errorMessage = "Failed to generate test. Please try again.";
+      } else if (result?.generatedContent) {
+        isError = false;
+        errorMessage = "";
+        testCasePrompt = "";
+        // Append generated content to existing script
+        const currentScript = tests?.script || "";
+        const separator = currentScript ? "\n\n" : "";
+        const newScript = currentScript + separator + result.generatedContent;
+        onTestsChange({ ...tests, script: newScript });
+      }
+    }
+  };
+</script>
+
+<div
+  class="border border-top-0 text-light p-2 h-100 rounded-bottom position-relative"
+>
+  <div class="d-flex h-100 flex-column">
+    <!-- Editor Area -->
+    <div
+      class="editor-container"
+      style="flex:1 1 auto; overflow:hidden; min-height:0;"
+    >
+      <Editor
+        bind:lang
+        value={tests?.script || ""}
+        on:change={handleCodeMirrorChange}
+        isEditable={true}
+        autofocus={true}
+        placeholder={`// What are the tests?\n// Tests are scripts that automatically check your API's response.\n// For example: Is the status code 200? Does the body contain an email field?\n// sp.test("Status code is 200", function () {\n//   sp.expect(sp.response.statusCode).to.equal(200);\n// });\n\n// You can:\n// - Use "Snippets" to insert common tests\n// - Type a prompt and click "Generate" to create tests using AI\n// - Or, write test cases manually using scripting`}
+        {isBodyBeautified}
+        beautifySyntaxCallback={updateBeautifiedState}
+      />
+    </div>
+
+    <!-- Bottom Bar with Snippets Dropdown and AI Input -->
+    <div
+      class="bottom-bar d-flex align-items-center"
+      style="flex:0 0 auto; margin-top:8px; gap:8px;"
+    >
+      <!-- Snippets Dropdown (Left) -->
+      <div
+        class="snippet-dropdown-container"
+        bind:this={snippetDropdownElement}
+      >
+        <Button
+          onClick={toggleSnippetDropdown}
+          size="small"
+          type={isSnippetDropdownOpen ? "primary" : "outline-secondary"}
+          title={"Snippets"}
+          endIcon={isSnippetDropdownOpen
+            ? ChevronUpRegular
+            : ChevronDownRegular}
+        />
+
+        {#if isSnippetDropdownOpen}
+          <div class="snippet-dropdown-menu">
+            <!-- Search -->
+            <div class="dropdown-search-container">
+              <Search
+                id="script-snippet-search"
+                variant="primary"
+                size="small"
+                bind:value={searchData}
+                placeholder="Search snippets"
+              />
+            </div>
+
+            <!-- Snippets List -->
+            <div class="dropdown-snippets-list">
+              {#if filteredSnippets.length > 0}
+                {#each filteredSnippets as snippet}
+                  <div
+                    class="snippet-item"
+                    tabindex="0"
+                    role="button"
+                    on:click={() => {
+                      selectSnippet(snippet.function);
+                      isSnippetDropdownOpen = false;
+                    }}
+                    on:keydown={(e) => {
+                      if (e.key === "Enter" || e.key === " ") {
+                        e.preventDefault();
+                        selectSnippet(snippet.function);
+                        isSnippetDropdownOpen = false;
+                      }
+                    }}
+                  >
+                    <p class="snippet-item-text">
+                      {@html highlightMatch(snippet.title, searchData)}
+                    </p>
+                  </div>
+                {/each}
+              {:else if trimmedSearch}
+                <div class="no-results">
+                  <div
+                    class="d-flex justify-content-center align-items-center"
+                    style="margin-bottom: 8px;"
+                  >
+                    <SearchIcon2
+                      width={"20px"}
+                      height={"20px"}
+                      color={"var(--bg-ds-neutral-300)"}
+                    />
+                  </div>
+                  <p class="no-results-text">
+                    No result found for "{searchData}"
+                  </p>
+                </div>
+              {/if}
+            </div>
+          </div>
+        {/if}
+      </div>
+
+      <!-- AI Input (Right) -->
+      <div class="ai-input-container" style="flex: 1;">
+        {#if errorMessage}
+          <div class="input-error">{errorMessage}</div>
+        {/if}
+        <div style="position: relative;">
+          <div class="input-with-button">
+            <Input
+              id="sparkle-input-post"
+              placeholder="Ask AI to generate a Post-Request test"
+              startIcon={SparkleColoredIcon}
+              iconSize={16}
+              variant="secondary"
+              size="medium"
+              bind:value={testCasePrompt}
+              {isError}
+              disabled={isTestCasesGenerating}
+              on:input={() => {
+                isError = false;
+                errorMessage = "";
+              }}
+            />
+          </div>
+          <div
+            style="position: absolute; right: 8px; top: 50%; transform: translateY(-50%);"
+          >
+            <Button
+              size="small"
+              type="outline-secondary"
+              startIcon={isTestCasesGenerating
+                ? SparkleFilledIcon
+                : SparkleColoredIcon}
+              title={"Generate"}
+              disable={isTestCasesGenerating || isError}
+              loading={isTestCasesGenerating}
+              onClick={() => {
+                if (!isTestCasesGenerating && testCasePrompt.trim()) {
+                  handleGenerateTestCases();
+                } else if (!testCasePrompt.trim()) {
+                  isError = true;
+                  errorMessage = "Please enter a prompt before generating.";
+                }
+              }}
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<style>
+  .input-with-button :global(input) {
+    padding-right: 120px !important;
+  }
+
+  .input-error {
+    color: var(--text-ds-danger-300, #e74c3c);
+    font-size: 12px;
+    margin-bottom: 4px;
+    text-align: left;
+  }
+
+  .bottom-bar {
+    padding-top: 8px;
+  }
+
+  .snippet-dropdown-container {
+    position: relative;
+  }
+
+  .snippet-dropdown-menu {
+    position: absolute;
+    bottom: 100%;
+    left: 0;
+    margin-bottom: 8px;
+    width: 320px;
+    max-height: 400px;
+    background-color: var(--bg-ds-surface-800);
+    border: 1px solid var(--border-ds-neutral-400);
+    border-radius: 8px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
+    display: flex;
+    flex-direction: column;
+    z-index: 1000;
+  }
+
+  .dropdown-search-container {
+    padding: 12px;
+    border-bottom: 1px solid var(--border-ds-neutral-400);
+  }
+
+  .dropdown-snippets-list {
+    flex: 1;
+    overflow-y: auto;
+    padding: 8px;
+  }
+
+  .snippet-item {
+    padding: 8px 12px;
+    cursor: pointer;
+    border-radius: 4px;
+    transition: all 0.2s ease;
+    margin-bottom: 4px;
+  }
+
+  .snippet-item:hover {
+    background-color: var(--bg-ds-surface-600);
+  }
+
+  .snippet-item:active {
+    background-color: var(--bg-ds-surface-500);
+  }
+
+  .snippet-item:focus-visible {
+    outline: none;
+    background-color: var(--bg-ds-surface-600);
+    border: 2px solid var(--bg-ds-primary-300);
+  }
+
+  .snippet-item-text {
+    font-family: "Inter", sans-serif;
+    font-weight: 500;
+    font-size: 12px;
+    color: var(--text-ds-primary-300);
+    margin: 0;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .no-results {
+    padding: 24px 16px;
+    text-align: center;
+  }
+
+  .no-results-text {
+    font-weight: 500;
+    font-size: 12px;
+    color: var(--text-ds-neutral-300);
+    margin: 0;
+  }
+
+  :global(.search-highlight) {
+    background-color: transparent;
+    color: var(--text-ds-neutral-50);
+    padding: 1px 2px;
+    border-radius: 2px;
+    font-weight: 600;
+  }
+
+  .editor-container {
+    width: 100%;
+  }
+
+  .ai-input-container {
+    position: relative;
+  }
+</style>
diff --git a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/script/utils/common-snippets.ts b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/script/utils/common-snippets.ts
new file mode 100644
index 0000000000..9c048f1a65
--- /dev/null
+++ b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/request-tests/sub-components/script/utils/common-snippets.ts
@@ -0,0 +1,136 @@
+export const predefinedTestSnippets = [
+  {
+    title: "Status Code is 200",
+    function: `sp.test("Status code is 200", function () {
+  sp.expect(sp.response.statusCode).to.equal(200);
+});`,
+  },
+  {
+    title: "Response time is less than 500ms",
+    function: `sp.test("Response time is less than 500ms", function () {
+  sp.expect(sp.response.time).to.be.lessThan(500);
+});`,
+  },
+  {
+    title: "Response body is not empty",
+    function: `sp.test("Response body is not empty", function () {
+  sp.expect(sp.response.body.text()).to.be.notEmpty();
+});`,
+  },
+  {
+    title: "Content-Type is application/json",
+    function: `sp.test("Content-Type is application/json", function () {
+  sp.expect(sp.response.headers["Content-Type"]).to.contain("application/json");
+});`,
+  },
+  {
+    title: "Response has id field",
+    function: `sp.test("Response has id field", function () {
+  let jsonData = sp.response.body.json();
+  sp.expect(jsonData).to.have.all.keys("id", "userId", "title", "completed");
+});`,
+  },
+  {
+    title: "Response has success = true",
+    function: `sp.test("Response has success = true", function () {
+  let jsonData = sp.response.body.json();
+  sp.expect(jsonData.success).to.equal(true);
+});`,
+  },
+  {
+    title: "User object contains name and email",
+    function: `sp.test("User object contains name and email", function () {
+  let jsonData = sp.response.body.json();
+  sp.expect(jsonData.user).to.have.all.keys("name", "email");
+});`,
+  },
+  {
+    title: "Array response contains at least one item",
+    function: `sp.test("Array response contains at least one item", function () {
+  let jsonData = sp.response.body.json();
+  sp.expect(jsonData.length).to.be.greaterThan(0);
+});`,
+  },
+  {
+    title: "Unauthorized request returns 401",
+    function: `sp.test("Unauthorized request returns 401", function () {
+  sp.expect(sp.response.statusCode).to.equal(401);
+  let jsonData = sp.response.body.json();
+  sp.expect(jsonData.message).to.equal("Unauthorized");
+});`,
+  },
+  {
+    title: "Response contains expected schema keys",
+    function: `sp.test("Response contains expected schema keys", function () {
+  let jsonData = sp.response.body.json();
+  sp.expect(jsonData).to.have.all.keys("id", "name", "email");
+});`,
+  },
+  {
+    title: "Response contains token field",
+    function: `sp.test("Response contains token field", function () {
+  let jsonData = sp.response.body.json();
+  sp.expect(jsonData).to.exist("token");
+});`,
+  },
+  {
+    title: "Token is a non-empty string",
+    function: `sp.test("Token is a non-empty string", function () {
+  let jsonData = sp.response.body.json();
+  sp.expect(jsonData.token).to.be.a("string");
+  sp.expect(jsonData.token).to.be.notEmpty();
+});`,
+  },
+  {
+    title: "Created resource returns 201",
+    function: `sp.test("Created resource returns 201", function () {
+  sp.expect(sp.response.statusCode).to.equal(201);
+});`,
+  },
+  {
+    title: "Response array contains specific field",
+    function: `sp.test("Response array contains specific field in objects", function () {
+  let jsonData = sp.response.body.json();
+  jsonData.forEach(item => {
+    sp.expect(item).to.exist("id");
+  });
+});`,
+  },
+  {
+    title: "Response has error field when status 400",
+    function: `sp.test("Response has error field when status 400", function () {
+  if (sp.response.statusCode === 400) {
+    let jsonData = sp.response.body.json();
+    sp.expect(jsonData).to.exist("error");
+  }
+});`,
+  },
+  {
+    title: "Response contains pagination fields",
+    function: `sp.test("Response contains pagination fields", function () {
+  let jsonData = sp.response.body.json();
+  sp.expect(jsonData).to.include.keys("page", "limit", "total");
+});`,
+  },
+  {
+    title: "Date field is valid ISO string",
+    function: `sp.test("Date field is valid ISO string", function () {
+  let jsonData = sp.response.body.json();
+  let date = new Date(jsonData.createdAt);
+  sp.expect(isNaN(date.getTime())).to.equal(false);
+});`,
+  },
+  {
+    title: "Response includes expected message text",
+    function: `sp.test("Response includes expected message text", function () {
+  let jsonData = sp.response.body.json();
+  sp.expect(jsonData.message).to.contain("success");
+});`,
+  },
+  {
+    title: "Response has Content-Length header",
+    function: `sp.test("Response has Content-Length header", function () {
+  sp.expect(sp.response.headers).to.exist("Content-Length");
+});`,
+  },
+];
diff --git a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/test-flow-bottom-panel/TestFlowBottomPanel.svelte b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/test-flow-bottom-panel/TestFlowBottomPanel.svelte
index 1280ad10f0..f7bd89bd93 100644
--- a/packages/@sparrow-workspaces/src/features/testflow-explorer/components/test-flow-bottom-panel/TestFlowBottomPanel.svelte
+++ b/packages/@sparrow-workspaces/src/features/testflow-explorer/components/test-flow-bottom-panel/TestFlowBottomPanel.svelte
@@ -18,6 +18,7 @@
     RequestParameterTestFlow,
     RequestAuthorizationTestFlow,
     RequestAssertionsTestFlow,
+    RequestTestsTestFlow,
     ResponseErrorScreen,
     ResponseHeaders,
     ResponseNavigator,
@@ -81,6 +82,8 @@
       requestNavigation = "Headers";
     } else if (tab === "Authorization") {
       requestNavigation = "Authorization";
+    } else if (tab === "Scripts" || tab === RequestSectionEnum.TESTS) {
+      requestNavigation = RequestSectionEnum.TESTS;
     } else if (tab === "Assertions") {
       requestNavigation = "Assertions";
     } else {
@@ -390,6 +393,24 @@
                 responseHeader={selectedNodeResponse?.response?.headers ?? []}
               />
             {/key}
+          {:else if requestNavigation === RequestSectionEnum.TESTS}
+            {#key selectedBlock?.id}
+              <RequestTestsTestFlow
+                tests={selectedBlock?.data?.requestData?.tests ?? {
+                  testCaseMode: "no-code",
+                  preScript: "",
+                  script: "",
+                }}
+                onTestsChange={(updatedTests) => {
+                  handleUpdateRequestData("tests", updatedTests);
+                }}
+                tabSplitDirection="horizontal"
+                onGenerateTestCases={undefined}
+                onGeneratePreScript={undefined}
+                isTestCasesGenerating={false}
+                isPreScriptGenerating={false}
+              />
+            {/key}
           {/if}
         </div>
       </div>