Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

modify test to show the history back problem #68

Open
wants to merge 2 commits into
base: siyu/fixErrorState
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
71 changes: 33 additions & 38 deletions applicationinsights-react-js/test/AppInsightsErrorBoundary.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -95,19 +95,24 @@ describe("<AppInsightsErrorBoundary />", () => {

function NewError() {
const navigate = useNavigate();
const ErrorDisplay = () => <div>You are on the error page</div>;

function handleClick() {
navigate(-1);
}

return (
<div>
<button onClick={handleClick}>go back</button>
<AppInsightsErrorBoundary
appInsights={reactPlugin}
onError={ErrorDisplay}>
<ErrorTestComponent />
</AppInsightsErrorBoundary>
</div>
<div>You are on the error page</div>
</div>
);
}

function BackButton() {
const navigate = useNavigate();

return (
<button type="button" onClick={() => navigate(-1)}>Back</button>
);
}

Expand All @@ -116,48 +121,38 @@ describe("<AppInsightsErrorBoundary />", () => {
if (orgError) {
console.error = msg => { /* Do Nothing */ };
}
const Home = () => <div>Home Page</div>
const About = () => <div>About Page</div>
const Home = () => <div>Home Page</div>;
const About = () => {
throw new Error("something went wrong");
};

try {
render(
<Router>
<AppInsightsErrorBoundary appInsights={reactPlugin} onError={NewError}>
<div>
<Link to="/">Home</Link>
<Link to="/about">About</Link>
<Link to="/error">Error</Link>
<button type="button" onClick={() => { window.history.go(-1); }}>Back</button>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/about" element={<About />} />
<Route path="/error" element={<NewError/>} />
</Routes>
<LocationDisplay />
</div>
<Link to="/">Home</Link>
<Link to="/about">About</Link>
<BackButton />
<Routes>
<Route path="/" element={<Home />} />
<Route path="/about" element={<About />} />
</Routes>
<LocationDisplay />
</div>
</AppInsightsErrorBoundary>
</Router>
);
expect(screen.getByText(/Home Page/i)).toBeInTheDocument()

// go to error page
await userEvent.click(screen.getByText(/error/i))
expect(screen.getByText(/You are on the error page/i)).toBeInTheDocument()
expect(trackExceptionSpy).toHaveBeenCalledTimes(1);

// go back to home page
await userEvent.click(screen.getByText(/go back/i));
expect(screen.getByText(/Home Page/i)).toBeInTheDocument();
expect(trackExceptionSpy).toHaveBeenCalledTimes(1);

// go to error page again
await userEvent.click(screen.getByText(/error/i))
expect(screen.getByText(/You are on the error page/i)).toBeInTheDocument()
console.log("track time", trackExceptionSpy.mock.calls.length);

// navigate to about page
await userEvent.click(screen.getByText(/about/i))
expect(screen.getByText(/About Page/i)).toBeInTheDocument()
// navigate to about page (throws error, so show error component)
await userEvent.click(screen.getByText(/about/i));
expect(screen.getByText(/You are on the error page/i)).toBeInTheDocument();
console.log("track time", trackExceptionSpy.mock.calls.length);

// go back to home page (no error, so show home component)
await userEvent.click(screen.getByText(/go back/i));
expect(screen.getByText(/Home Page/i)).toBeInTheDocument();
} finally {
if (orgError) {
console.error = orgError;
Expand Down