angular / angular/angularfire

AppCheck Build Error During Prerender for Angular SSR

Open
#3,128 9 comments 3 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
7.8k
Forks
2.2k
Avg merge
22h 28m
Merged PRs (30d)
6

Description

### Version info

**Angular:** 13.0.3

**Firebase:** 9.6.4

**AngularFire:** 7.2.0

**Other (e.g. Ionic/Cordova, Node, browser, operating system):** Node 14

### How to reproduce these conditions
**Steps to set up and reproduce**

After setting up AppCheck as such:

```typescript

import { initializeAppCheck, provideAppCheck, ReCaptchaV3Provider } from '@angular/fire/app-check';

provideAppCheck(() => initializeAppCheck(getApp(), { provider: new ReCaptchaV3Provider(environment.recaptchaSiteKey), isTokenAutoRefreshEnabled: true })),
```

I am able to serve my application with both `yarn server` and `yarn dev:ssr` and I'm able to load the site with AppCheck seemingly working. However, when I try to run `yarn prerender`, I get the following error:

```
Unhandled Promise rejection: document is not defined ; Zone: ; Task: Promise.then ; Value: ReferenceError: document is not defined
```

Contributor guide

Open the contributing guide

Research direction

Start with the AppCheck initialization shown in the issue and reproduce the failure with `yarn prerender` under Angular SSR. Trace which AppCheck setup accesses `document` during prerendering; done means prerender completes without the `document is not defined` error while serving and development SSR continue to work.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
build-system, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.