Skip to content

bug: app.component.html:1 ERROR NotFoundError: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node. #29848

@scotch83

Description

@scotch83

Prerequisites

Ionic Framework Version

v8.x

Current Behavior

When creating a new app using the CLI, using angular standalone, run npm start, nothing is shown in the browser and the console shows this error:

core.mjs:7397 ERROR NotFoundError: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.
    at addStyle (index.js:858:34)
    at attachStyles (index.js:887:20)
    at index.js:1705:5
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (asyncToGenerator.js:3:1)
    at _next (asyncToGenerator.js:17:1)
    at asyncToGenerator.js:22:1
    at new ZoneAwarePromise (zone.js:2702:25)
    at asyncToGenerator.js:14:1
    at updateComponent (index.js:1699:20)

Further investigation

  1. removing all the html generated code does not show the error.
  2. removing only the ion-app shows the error but also show the page

It feels like there is something wrong in the IonApp component

Expected Behavior

The app is shown in the browser and no error appears in the console

Steps to Reproduce

  1. run ionic start test-app
  2. run npm start from the app root directory
  3. open the browser and navigate to localhost:4200 (nothing appears, only a black screen)
  4. open also the console pressing F12 to see the error

Code Reproduction URL

https://stackblitz.com/~/github.com/scotch83/test-ionic-angular-standalone

Ionic Info

ionic info
[WARN] Error loading @capacitor/ios package.json: Error: Cannot find module '@capacitor/ios/package.json'

   Require stack:
   - /Users/scotch-83/.nvm/versions/node/v22.6.0/lib/node_modules/@ionic/cli/lib/project/index.js
   - /Users/scotch-83/.nvm/versions/node/v22.6.0/lib/node_modules/@ionic/cli/lib/index.js
   - /Users/scotch-83/.nvm/versions/node/v22.6.0/lib/node_modules/@ionic/cli/index.js
   - /Users/scotch-83/.nvm/versions/node/v22.6.0/lib/node_modules/@ionic/cli/bin/ionic

[WARN] Error loading @capacitor/android package.json: Error: Cannot find module '@capacitor/android/package.json'

   Require stack:
   - /Users/scotch-83/.nvm/versions/node/v22.6.0/lib/node_modules/@ionic/cli/lib/project/index.js
   - /Users/scotch-83/.nvm/versions/node/v22.6.0/lib/node_modules/@ionic/cli/lib/index.js
   - /Users/scotch-83/.nvm/versions/node/v22.6.0/lib/node_modules/@ionic/cli/index.js
   - /Users/scotch-83/.nvm/versions/node/v22.6.0/lib/node_modules/@ionic/cli/bin/ionic

Ionic:

Ionic CLI : 7.2.0 (/Users/scotch-83/.nvm/versions/node/v22.6.0/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/angular 8.3.0
@angular-devkit/build-angular : 18.2.3
@angular-devkit/schematics : 18.2.3
@angular/cli : 18.2.3
@ionic/angular-toolkit : 11.0.1

Capacitor:

Capacitor CLI : 6.1.2
@capacitor/android : not installed
@capacitor/core : 6.1.2
@capacitor/ios : not installed

Utility:

cordova-res : not installed globally
native-run : 2.0.1

System:

NodeJS : v22.6.0 (/Users/scotch-83/.nvm/versions/node/v22.6.0/bin/node)
npm : 10.8.2
OS : macOS Unknown

Additional Information

Ionic info did not find information about my mac:

MacOS Sonoma 14.5

Chip: Apple Silicon M2 Pro

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions