From f2c3125ce6c61e0d5161986613608e1a85f41517 Mon Sep 17 00:00:00 2001 From: Rahul Barwal Date: Fri, 1 Nov 2024 15:18:41 +0530 Subject: [PATCH] chore: adds automation for request templates component (#37140) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Description This was done manually by QA team. This unit test ensures that a valid URL is present for requesting template and is opens correctly. Fixes #`Issue Number` _or_ Fixes `Issue URL` > [!WARNING] > _If no issue exists, please create an issue first, and check with the maintainers if the issue is valid._ ## Automation /ok-to-test tags="@tag.Templates" ### :mag: Cypress test results > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: > Commit: 9a48f0593bee7d9e7e11c00b21e42106a6e1027f > Cypress dashboard. > Tags: `@tag.Templates` > Spec: >
Wed, 30 Oct 2024 12:27:43 UTC ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [x] No ## Summary by CodeRabbit - **New Features** - Introduced a new test suite for the `RequestTemplate` component to validate its behavior and user interactions. - `REQUEST_TEMPLATE_URL` and `RequestTemplateProps` are now exported for use in other modules. - **Bug Fixes** - Enhanced testing to ensure correct message display and button functionality within the `RequestTemplate`. - **Documentation** - Updated import statements for better organization and clarity. --- .../Template/RequestTemplate.test.tsx | 63 +++++++++++++++++++ .../Templates/Template/RequestTemplate.tsx | 14 ++--- 2 files changed, 70 insertions(+), 7 deletions(-) create mode 100644 app/client/src/pages/Templates/Template/RequestTemplate.test.tsx diff --git a/app/client/src/pages/Templates/Template/RequestTemplate.test.tsx b/app/client/src/pages/Templates/Template/RequestTemplate.test.tsx new file mode 100644 index 0000000000..c88f60a828 --- /dev/null +++ b/app/client/src/pages/Templates/Template/RequestTemplate.test.tsx @@ -0,0 +1,63 @@ +import { createMessage } from "@appsmith/ads-old"; +import "@testing-library/jest-dom"; +import { fireEvent, render } from "@testing-library/react"; +import { + REQUEST_BUILDING_BLOCK, + REQUEST_TEMPLATE, +} from "ee/constants/messages"; +import AnalyticsUtil from "ee/utils/AnalyticsUtil"; +import { unitTestBaseMockStore } from "layoutSystems/common/dropTarget/unitTestUtils"; +import React from "react"; +import { Provider } from "react-redux"; +import configureStore from "redux-mock-store"; +import { lightTheme } from "selectors/themeSelectors"; +import { ThemeProvider } from "styled-components"; +import RequestTemplate, { + REQUEST_TEMPLATE_URL, + type RequestTemplateProps, +} from "./RequestTemplate"; +const mockStore = configureStore([]); + +const BaseComponentRender = ( + props: RequestTemplateProps, + storeToUse = unitTestBaseMockStore, +) => ( + + + + + +); + +describe("RequestTemplate", () => { + it("should display correct message based on isBuildingBlock prop", () => { + const { getByText } = render( + BaseComponentRender({ isBuildingBlock: true }), + ); + + expect( + getByText(createMessage(REQUEST_BUILDING_BLOCK)), + ).toBeInTheDocument(); + }); + it("should open REQUEST_TEMPLATE_URL in a new window when button is clicked", () => { + const openSpy = jest.spyOn(window, "open"); + const { getByText } = render( + BaseComponentRender({ isBuildingBlock: false }), + ); + const button = getByText(createMessage(REQUEST_TEMPLATE)); + + fireEvent.click(button); + expect(openSpy).toHaveBeenCalledWith(REQUEST_TEMPLATE_URL); + }); + + it('should trigger AnalyticsUtil logEvent with "REQUEST_NEW_TEMPLATE" when button is clicked', () => { + const logEventSpy = jest.spyOn(AnalyticsUtil, "logEvent"); + const { getByText } = render( + BaseComponentRender({ isBuildingBlock: false }), + ); + const button = getByText(createMessage(REQUEST_TEMPLATE)); + + fireEvent.click(button); + expect(logEventSpy).toHaveBeenCalledWith("REQUEST_NEW_TEMPLATE"); + }); +}); diff --git a/app/client/src/pages/Templates/Template/RequestTemplate.tsx b/app/client/src/pages/Templates/Template/RequestTemplate.tsx index 68fce42e6d..10b8b14e7d 100644 --- a/app/client/src/pages/Templates/Template/RequestTemplate.tsx +++ b/app/client/src/pages/Templates/Template/RequestTemplate.tsx @@ -1,16 +1,16 @@ -import React from "react"; -import styled from "styled-components"; -import { Text, TextType } from "@appsmith/ads-old"; import { Button } from "@appsmith/ads"; +import { Text, TextType } from "@appsmith/ads-old"; import RequestTemplateSvg from "assets/images/request-template.svg"; import { COULDNT_FIND_TEMPLATE, - createMessage, COULDNT_FIND_TEMPLATE_DESCRIPTION, - REQUEST_TEMPLATE, + createMessage, REQUEST_BUILDING_BLOCK, + REQUEST_TEMPLATE, } from "ee/constants/messages"; import AnalyticsUtil from "ee/utils/AnalyticsUtil"; +import React from "react"; +import styled from "styled-components"; const Wrapper = styled.div` border: 1px solid var(--ads-v2-color-border); @@ -48,10 +48,10 @@ const StyledImage = styled.img` border-radius: var(--ads-v2-border-radius); `; -const REQUEST_TEMPLATE_URL = +export const REQUEST_TEMPLATE_URL = "https://app.appsmith.com/app/request-templates/request-list-6241c12fc99df2369931a714"; -interface RequestTemplateProps { +export interface RequestTemplateProps { isBuildingBlock?: boolean; }