Skip to content

zacharypodbela/sentry-nextjs-crash-demo

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 

Repository files navigation

Sentry + NextJS: Minified Crash Not Logged Demo

Rebuild the project from scratch

In an empty working directory...

  1. Run the following commands one at a time in Terminal to do a vanilla installation of NextJS. (See NextJS Docs):
npx create-next-app sentry-nextjs-crash-demo
cd sentry-nextjs-crash-demo
rm next.config.js

(sentry-nextjs-crash-demo is just an app name and can be anything.)

  1. Run the following commands one at a time in Terminal to install Sentry for NextJS. (See Sentry Docs):
npm install --save @sentry/nextjs
npx @sentry/wizard -i nextjs

(You'll need a NextJS Project in Sentry to send events to, which the terminal with prompt you to choose during setup.)

  1. Replace everything in pages/index.js with the following, which create two buttons that cause intentional runtime errors. We'll use these in a moment to test error logging in Sentry:
import { useState } from 'react'

const Debug = () => {
  const [value, setValue] = useState({ words: "to test error reporting." });

  return (
    <div>
      <p>
        <button onClick={() => thisIsNotReal()}>
          Cause Intentional ReferenceError
        </button>
        <span>to test error reporting.</span>
      </p>
      <p>
        <button onClick={() => setValue(undefined)}>
          Cause Intentional TypeError (App Crash)
        </button>
        <span>{value.words}</span>
      </p>
    </div>
  );
};

export default Debug;

Run the project and demo the issue

  1. Run the following commands one at a time in Terminal to run a production version of the application locally
npm run build
npm run start

(Note 1: Must be run while still inside the sentry-nextjs-crash-demo folder) _(Note 2: There is a known Sentry issue (#3968) where npm run build doesn't read from .sentryclirc. You may need to set your auth token as an environment variable with export SENTRY_AUTH_TOKEN= to get the build to succeed if this issue remains unresolved.)

  1. Navigate to localhost:3000. (Open the Console to capture additional output.)
  2. Click the top button to cause a ReferenceError that will not crash the app. You will see the error output in the console and properly reported in Sentry. Console output
  3. Click the top button to cause a TypeError that will crash the app. You will see the error output in the console, but it will not be reported in Sentry. Console output

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published