Angular-cli: Content not rendering on initial page load

[HFTSOL]

OS?

Dev: Windows 7 Pro
IIS: Windows Server 2012

Versions.

angular-cli: 1.0.0-beta.22-1
node: 7.2.1

3rd Party Libraries

{
    "ag-grid": "^7.1.0",
    "ag-grid-ng2": "^7.1.2",
    "amcharts3": "github:amcharts/amcharts3",
    "ammap3": "github:amcharts/ammap3"
}

The log given by the failure.

No error and no log.

Description

We are encountering an odd issue with Ag-Grid (ag-grid-ng2) and AmCharts in both dev, and test (prod build). On initial page load, some of the grids and charts aren't rendering, and some are rendering only some of the time. While checking the source, the structure of each chart/grid is there, but has either no width, height, or both if those dimensions were dynamically calculated in JS instead of dictated by css. The confusing part is that the page renders normally if I use internal app links to navigate to it, meaning I navigate from one app page to another using the NG router instead of navigating directly to the page via url or using the browser's refresh feature.

Through exhaustive testing I have determined that I have run out of ideas. I've stripped the page down to base elements, tried the components in different pages, checked the data and configuration as far as I know how, and put feelers as far into the 3rd party libraries as I can... no dice.

What I'm looking for is either an explanation of what's going on or not working; or someone to suggest something else, or some other way, I can test the app. I can't break out the code because it's tightly integrated into our architecture, but I can answer questions and I'm willing to try almost anything that might get some results.

Thanks in advance.

[filipesilva]

Can you try using these changes (https://github.com/angular/angular-cli/pull/3812) on your project? Basically loading the polyfills via the script array instead of the polyfills file.

[filipesilva]

(just the changes in packages/angular-cli/blueprints, the rest are internal).

[HFTSOL]

@filipesilva
Thanks for the reply.

Just to confirm, you are talking about commenting out the import of polyfills.ts in main.ts and adding the following references to angular-cli.json under apps.scripts, right?

[
      "../node_modules/core-js/client/shim.min.js",
      "../node_modules/zone.js/dist/zone.js",
      "../node_modules/reflect-metadata/Reflect.js"
]

If this is right, then I see no discernible effect. :-(

[filipesilva]

Yes that was my suggesting. I was wondering if it was a zone.js or polyfills issue and if so, this should fix it.

I don't know what's happening then. It seems to be some kind of problem while booting up your app. I don't think it's a build issue from the description... but if you want to try and change build settings you can do it on your local node_modules in this file: https://github.com/angular/angular-cli/blob/master/packages/angular-cli/models/webpack-build-common.ts

The changes will not persist on reinstalls but if you find something that needs to be fixed, we can try to incorporate it.

I'm sorry I couldn't help more.

[HFTSOL]

No problem. I appreciate the try. Chances are the polyfill change will help me somewhere I'll never know.

I'll take a look through the link and build options to see if there's anything that might help.

Thanks again.

[HFTSOL]

Anyone else? Three shots for a nickel with a $0.05 discount for a limited time!

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}