Repository: appsmithorg/appsmith
File: app/client/src/pages/AppIDE/layouts/routers/JSEditor/JSRender.test.tsx (TypeScript)

Code before:
import { render, waitFor } from "test/testUtils";
import { Route } from "react-router-dom";
import { BUILDER_PATH } from "ee/constants/routes/appRoutes";
import { StaticLayout as IDE } from "../../StaticLayout";
import React from "react";
import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages";
import { getIDETestState } from "test/factories/AppIDEFactoryUtils";
import { EditorEntityTab, EditorViewMode } from "IDE/Interfaces/EditorTypes";
import { PageFactory } from "test/factories/PageFactory";
import { JSObjectFactory } from "test/factories/Actions/JSObject";

// Mock JSEditorForm component
jest.mock("pages/Editor/JSEditor/JSEditorForm/JSEditorForm", () => {
  return {
    __esModule: true,
    JSEditorForm: () => <div data-testid="t--mock-js-editor-form" />,
  };
});

const basePageId = "0123456789abcdef00000000";

describe("IDE Render: JS", () => {
  describe("JS Blank State", () => {
    it("Renders Fullscreen Blank State", async () => {
      const { findByText, getByRole, getByText } = render(
        <Route path={BUILDER_PATH}>
          <IDE />
        </Route>,
        {
          url: `/app/applicationSlug/pageSlug-${basePageId}/edit/jsObjects`,
        },
      );

      // Main pane text
      await findByText(createMessage(EDITOR_PANE_TEXTS.js_blank_state));

      // Left pane text

Review comment (suggestion):
@hetunandu Thanks for the PR. I see that the execution time of `JsRender` has decreased by 2 times, but the execution time of `QueryReader` is still the same. Could you check why this is so?

The timeout is also triggered for each individual `it`, so you can check which `it` takes which time with logs, like this

```
  beforeEach(() => {
    testStartTime = Date.now();
  });

  afterEach(() => {
    const testDuration = Date.now() - testStartTime;
    console.log(`🕒 Test "${expect.getState().currentTestName}" took ${testDuration}ms`);
  });
```

Code after:
import { render, waitFor } from "test/testUtils";
import { Route } from "react-router-dom";
import { BUILDER_PATH } from "ee/constants/routes/appRoutes";
import { StaticLayout as IDE } from "../../StaticLayout";
import React from "react";
import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages";
import { getIDETestState } from "test/factories/AppIDEFactoryUtils";
import { EditorEntityTab, EditorViewMode } from "IDE/Interfaces/EditorTypes";
import { PageFactory } from "test/factories/PageFactory";
import { JSObjectFactory } from "test/factories/Actions/JSObject";

// Mock the LazyCodeEditor component
jest.mock("components/editorComponents/LazyCodeEditor/index", () => {
  return {
    __esModule: true,
    default: () => <div data-testid="t--code-editor" />,
  };
});

const basePageId = "0123456789abcdef00000000";

describe("IDE Render: JS", () => {
  describe("JS Blank State", () => {
    it("Renders Fullscreen Blank State", async () => {
      const { findByText, getByRole, getByText } = render(
        <Route path={BUILDER_PATH}>
          <IDE />
        </Route>,
        {
          url: `/app/applicationSlug/pageSlug-${basePageId}/edit/jsObjects`,
        },
      );

      // Main pane text
      await findByText(createMessage(EDITOR_PANE_TEXTS.js_blank_state));

      // Left pane text