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

fix render page with angular12 universal (SSR) #59

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

a-shpota
Copy link

@a-shpota a-shpota commented May 6, 2022

Problem:
Has problem on use package with Zone.js of angular universal.
Server (SSR) don`t render page while there are active ones zone.js macrotask.

Removed using setInterval & setTimeout

@a-shpota a-shpota changed the title fix render page with angular universal (SSR) fix render page with angular12 universal (SSR) May 6, 2022
@a-shpota a-shpota marked this pull request as ready for review May 6, 2022 08:50
@szmarczak
Copy link
Owner

Does Zone.js just replace the globals or monkey-patch the Node.js modules as well? I mean: could we just add

const {setTimeout, setInterval} = require('timers');

at the beginning?

@a-shpota
Copy link
Author

a-shpota commented May 8, 2022

yes, timers monky-patched by zone.js, and needed for working ChangeDetection mechanism of angular.

@szmarczak
Copy link
Owner

It seems that it just works with .unref() so no changes should be required?

import 'zone.js';

Zone.current.run(() => {
        setTimeout(() => {
                console.log('foobar');
        }, 1000).unref();
});

// Uncomment this and foobar will be logged:
// setTimeout(() => {}, 1100);

@szmarczak
Copy link
Owner

I just tested

import 'zone.js';
import CacheableLookup from 'cacheable-lookup';

const cacheable = new CacheableLookup();

Zone.current.run(() => {
        cacheable.lookup('google.com', console.log);
});

and it exists right away. Are you sure it is cacheable-lookup that is keeping the zone busy?

@a-shpota
Copy link
Author

a-shpota commented May 8, 2022

i prepare repo for reproducing case and hope you can help me find the right solution

https://github.com/a-shpota/cacheable-reproduce

npm ci && npm run build:ssr && npm run serve:ssr and try render page with request curl -v "http://localhost:4000"

in console print pending makrotasks with trace

entrypoint server.ts

@szmarczak
Copy link
Owner

I got

npm ERR! code ENOTFOUND
npm ERR! syscall getaddrinfo
npm ERR! errno ENOTFOUND
npm ERR! network request to http://registry.rozetka.company/repository/npm-rzk-proxy/yargs-parser/-/yargs-parser-13.1.2.tgz failed, reason: getaddrinfo ENOTFOUND registry.rozetka.company

when running npm ci, is this expected?

@a-shpota
Copy link
Author

a-shpota commented May 8, 2022

no, sorry. We used cacheable proxy. Fixes pushed

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants