Client StatefulComponent fails at runtime when used with Jaspr 0.12.0, index.template.html and no div wrapped Router

[ponderMuse]

Description

Apps with StatefulComponent client fail at runtime when using the following setup:

• Jaspr 0.12.0
• runApp(Document.template(name: 'index',child: App()));
• an App() where a Router is yielded without a div() component outside it.

When the StatefulComponent fails, the following stacktrace is shown in browser console:

Uncaught (in promise) Error: Assertion failed: org-dartlang-app:///packages/jaspr/src/browser/dom_render_object.dart:209:14 parentNode is html.Element is not true at Object.throw_ [as throw] (errors.dart:297:3) at Object.assertFailed (errors.dart:38:3) at dom_render_object.DomRenderObject.new.attach (dom_render_object.dart:209:24) at framework.DomElement.new.attachRenderObject (render_object.dart:75:5) at framework.BuildOwner.new.performRebuildOn (build_owner.dart:91:10) at framework.DomElement.new.rebuild (framework.dart:796:5) at [_firstBuild] (multi_child_element.dart:37:5) at [_firstBuild] (render_object.dart:59:11) at framework.DomElement.new.mount (multi_child_element.dart:31:5) at framework.StatefulElement.new.inflateComponent (framework.dart:450:13) at framework.StatefulElement.new.updateChild (framework.dart:316:18) at framework.StatefulElement.new.updateChildren (multi_child_element.dart:197:32) at framework.StatefulElement.new.performRebuild (multi_child_element.dart:69:17) at framework.StatefulElement.new.performRebuild (stateful_component.dart:684:11) at framework.BuildOwner.new.performRebuildOn (build_owner.dart:84:27) at framework.StatefulElement.new.rebuild (framework.dart:796:5) at [_firstBuild] (multi_child_element.dart:37:5) at [_firstBuild] (stateful_component.dart:640:11) at framework.StatefulElement.new.mount (multi_child_element.dart:31:5) at framework._RootElement.new.inflateComponent (framework.dart:450:13) at framework._RootElement.new.updateChild (framework.dart:316:18) at framework._RootElement.new.performRebuild (single_child_element.dart:61:14) at framework.BuildOwner.new.performRebuildOn (build_owner.dart:84:27) at framework._RootElement.new.rebuild (framework.dart:796:5) at [_firstBuild] (single_child_element.dart:31:5) at [_firstBuild] (render_object.dart:59:11) at framework._RootElement.new.mount (single_child_element.dart:25:5) at performInitialBuild (build_owner.dart:13:12) at performInitialBuild.next () at runBody (async_patch.dart:84:54) at Object._async [as async] (async_patch.dart:127:5) at framework.BuildOwner.new.performInitialBuild (build_owner.dart:12:35) at browser_binding.BrowserAppBinding.new. (components_binding.dart:20:23) at Generator.next () at runBody (async_patch.dart:84:54) at Object._async [as async] (async_patch.dart:127:5) at components_binding.dart:8:32 at framework.BuildOwner.new.lockState (build_owner.dart:66:25) at lockState.next () at runBody (async_patch.dart:84:54) at Object._async [as async] (async_patch.dart:127:5) at framework.BuildOwner.new.lockState (build_owner.dart:59:25) at browser_binding.BrowserAppBinding.new.attachRootComponent (components_binding.dart:8:21) at attachRootComponent.next () at runBody (async_patch.dart:84:54) at Object._async [as async] (async_patch.dart:127:5) at browser_binding.BrowserAppBinding.new.attachRootComponent (components_binding.dart:6:35) at browser_binding.BrowserAppBinding.new.attachRootComponent (browser_binding.dart:43:18) at Object._runClient (clients.dart:45:3) at Object._applyClients (clients.dart:81:11) at Object.runAppWithParams (clients.dart:91:3) at main (stateful.client.dart:8:3) at stateful.client.dart.bootstrap.js:273:10 at Array.forEach () at window.$dartRunMain (stateful.client.dart.bootstrap.js:272:32) at :1:8 at Object.runMain (client.js:9908:21) at client.js:26172:19 at _wrapJsFunctionForAsync_closure.$protected (client.js:4060:15) at _wrapJsFunctionForAsync_closure.call$2 (client.js:12486:12) at Object._asyncStartSync (client.js:4024:20) at main__closure4.$call$body$main__closure (client.js:26188:16) at main__closure4.call$1 (client.js:26101:19) at StaticClosure._rootRunUnary (client.js:4443:16) at _CustomZone.runUnary$2$2 (client.js:13881:39) at _CustomZone.runUnaryGuarded$1$2 (client.js:13828:14) at _ControllerSubscription._sendData$1 (client.js:13421:19) at _DelayedData.perform$1 (client.js:13604:59) at _PendingEvents_schedule_closure.call$0 (client.js:13663:14) at Object._microtaskLoop (client.js:4283:24) at StaticClosure._startMicrotaskLoop (client.js:4289:11) at _AsyncRun__initializeScheduleImmediate_internalCallback.call$1 (client.js:12363:9)

Steps To Reproduce

1. Ensure Jaspr is updated to version 0.11.1
2. Clone example minimal project at https://github.com/ponderMuse/jaspr_index_template_issue
3. jaspr clean
4. jaspr build
5. jaspr serve

Doctor Output

[✓] Jaspr CLI (Version 0.12.0) • Dart Version 3.3.0 (stable) (Tue Feb 13 10:25:19 2024 +0000) on "linux_x64" at /mnt/data/flutter/bin/cache/dart-sdk/bin/dart • Running on linux Linux 5.15.0-102-generic #112-Ubuntu SMP Tue Mar 5 16:50:32 UTC 2024 - Locale en_GB.UTF-8 • Analytics: Enabled

[✓] Current Project • Dependencies on core packages: • jaspr: Missing Dependency • Rendering mode: server • Uses jaspr compilers: false • Uses flutter embedding: false

Expected Behavior

The StatefulComponent should wait 5 seconds and display a message when the app is run.

Additional Context

In App.dart I have included a code snippet which does wrap Router with a div() which is commented out that can be swapped in/out to see the StatefulComponent working/not working.

Not sure if the div() outside Router is required or NOT but I can say that the code without div() outside Router worked fine in Jaspr 0.10.0 using an index.html file, works okay in 0.12.0 when NOT using index.template.html file (i.e. works okay when using programmatic root Document()).

[schultek]

Working on a fix

[schultek]

Fixed in 0.13.0