JavaScript answer

Cannot read properties of null

This TypeError means code tried to read a property from a value that is explicitly null.

Common causes

What usually causes this JavaScript error.

Start with the runtime condition that produced the error, then narrow by route, release, browser, and user action.

document.querySelector did not find the element.

A framework ref has not mounted yet or was cleared during unmount.

The API returned null for a relationship that the UI expected to be present.

Code ran before the DOM or data dependency was ready.

Reproduce

Remove the matching DOM node or return a null field from the API fixture.

const button = document.querySelector("[data-save]");
button.addEventListener("click", saveDraft);

Fix

Apply the smallest code change that makes the missing, nullable, blocked, or timing-sensitive value explicit.

Check DOM queries before using the element

Treat querySelector results as nullable and branch early when the selector misses.

const button = document.querySelector("[data-save]");
if (!button) return;

button.addEventListener("click", saveDraft);

Render only when required data exists

For nullable API relationships, show an empty state before reading nested fields.

if (invoice.customer === null) {
  return <EmptyCustomerState invoiceId={invoice.id} />;
}

return <CustomerSummary customer={invoice.customer} />;

Production monitoring

Once the local fix is clear, production monitoring should tell you whether the same failure is isolated, user-impacting, or tied to a release.

Capture selector, route, release, and browser details.

Connect stack traces to replay to see whether the element was rendered or removed.

Separate nullable API data issues from timing issues by tagging request state.