github.com/tilt-dev/tilt@v0.36.0/web/src/AnalyticsNudge.test.tsx (about) 1 import { render, screen, waitFor } from "@testing-library/react" 2 import userEvent from "@testing-library/user-event" 3 import fetchMock, { MockResponseObject } from "fetch-mock" 4 import React from "react" 5 import AnalyticsNudge, { NUDGE_TIMEOUT_MS } from "./AnalyticsNudge" 6 7 function mockAnalyticsOptInOnce(optIn = true, error = false) { 8 const response: MockResponseObject = error ? { status: 500 } : {} 9 const opt = optIn ? "opt-in" : "opt-out" 10 fetchMock.postOnce("//localhost/api/analytics_opt", response, { 11 body: { opt }, 12 }) 13 } 14 15 describe("AnalyticsNudge", () => { 16 afterEach(() => fetchMock.reset()) 17 18 it("shows nudge if `needNudge` is true and no request has been made", () => { 19 render(<AnalyticsNudge needsNudge={true} />) 20 21 expect(screen.getByLabelText("Tilt analytics options")).toBeInTheDocument() 22 }) 23 24 it("does NOT show nudge if `needsNudge` is false and no request has been made", () => { 25 render(<AnalyticsNudge needsNudge={false} />) 26 27 expect(screen.queryByLabelText("Tilt analytics options")).toBeNull() 28 }) 29 30 it("does NOT show nudge after it has been dismissed", async () => { 31 mockAnalyticsOptInOnce(false) 32 33 render(<AnalyticsNudge needsNudge={true} />) 34 35 expect(screen.getByLabelText("Tilt analytics options")).toBeInTheDocument() 36 37 userEvent.click(screen.getByRole("button", { name: /nope/i })) 38 39 await waitFor(() => { 40 userEvent.click(screen.getByRole("button", { name: /dismiss/i })) 41 }) 42 43 expect(screen.queryByLabelText("Tilt analytics options")).toBeNull() 44 }) 45 46 it("shows request-in-progress message when a request is in progress", () => { 47 mockAnalyticsOptInOnce(false) 48 49 render(<AnalyticsNudge needsNudge={true} />) 50 51 userEvent.click(screen.getByRole("button", { name: /nope/i })) 52 53 expect(screen.getByTestId("opt-loading")) 54 }) 55 56 it("shows success message for opt out", async () => { 57 mockAnalyticsOptInOnce(false) 58 render(<AnalyticsNudge needsNudge={true} />) 59 60 userEvent.click(screen.getByRole("button", { name: /nope/i })) 61 62 await waitFor(() => { 63 expect(screen.getByTestId("optout-success")).toBeInTheDocument() 64 }) 65 }) 66 67 it("shows success message for opt in", async () => { 68 mockAnalyticsOptInOnce(true) 69 render(<AnalyticsNudge needsNudge={true} />) 70 71 userEvent.click(screen.getByRole("button", { name: /I'm in/i })) 72 73 await waitFor(() => { 74 expect(screen.getByTestId("option-success")).toBeInTheDocument() 75 }) 76 }) 77 78 it("shows a failure message when request fails", async () => { 79 mockAnalyticsOptInOnce(true, true) 80 render(<AnalyticsNudge needsNudge={true} />) 81 82 userEvent.click(screen.getByRole("button", { name: /I'm in/i })) 83 84 await waitFor(() => { 85 expect(screen.getByRole("alert")).toBeInTheDocument() 86 }) 87 }) 88 89 it("dismisses the success message after a set delay", async () => { 90 jest.useFakeTimers() 91 mockAnalyticsOptInOnce(true) 92 render(<AnalyticsNudge needsNudge={true} />) 93 94 userEvent.click(screen.getByRole("button", { name: /I'm in/i })) 95 96 await waitFor(() => { 97 expect(screen.getByTestId("option-success")).toBeInTheDocument() 98 }) 99 100 jest.advanceTimersByTime(NUDGE_TIMEOUT_MS) 101 102 expect(screen.queryByLabelText("Tilt analytics options")).toBeNull() 103 }) 104 })