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.

Sign up for GitHub

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

Jump to bottom

EXCEPTION: type 'ShadowRootImpl' is not a subtype of type 'Element' of 'function #25969

Closed
zoechi opened this issue Mar 10, 2016 · 12 comments
Closed

EXCEPTION: type 'ShadowRootImpl' is not a subtype of type 'Element' of 'function #25969

zoechi opened this issue Mar 10, 2016 · 12 comments

Comments

@zoechi
Copy link
Contributor

zoechi commented Mar 10, 2016

This works fine in Chrome Version 49.0.2623.75 beta (64-bit)

but fails in Dartium Version 45.0.2454.0 (64-bit)

Dart VM version: 1.16.0-edge.6f6b345f751f14f61d348b3ea53df35828effe71 (Wed Mar 9 15:34:20 2016) on "linux_x64"

I have a few simple Angular components with encapsulation: ViewEncapsulation.Native and <ng-content></ng-content> inside a component with encapsulation: ViewEncapsulation.Emulated.

When I changed all elements to encapsulation: ViewEncapsulation.Emulated the exception didn't occur anymore.

# Generated by pub
# See http://pub.dartlang.org/doc/glossary.html#lockfile
packages:
  analyzer:
    description:
      name: analyzer
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.27.2"
  angular2:
    description:
      name: angular2
      url: "https://pub.dartlang.org"
    source: hosted
    version: "2.0.0-beta.9"
  args:
    description:
      name: args
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.13.3+6"
  async:
    description:
      name: async
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.9.0"
  barback:
    description:
      name: barback
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.15.2+7"
  browser:
    description:
      name: browser
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.10.0+2"
  bwu_sass_transformer:
    description:
      path: "../bwu_sass_transformer"
      relative: true
    source: path
    version: "0.4.2"
  charcode:
    description:
      name: charcode
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.1.0"
  cli_util:
    description:
      name: cli_util
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.0.1+2"
  code_transformers:
    description:
      name: code_transformers
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.4.1"
  collection:
    description:
      name: collection
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.4.0"
  crypto:
    description:
      name: crypto
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.9.1"
  csslib:
    description:
      name: csslib
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.12.2"
  dart_style:
    description:
      name: dart_style
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.2.4"
  dart_to_js_script_rewriter:
    description:
      name: dart_to_js_script_rewriter
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.1.0+4"
  fixnum:
    description:
      name: fixnum
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.10.2"
  func:
    description:
      name: func
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.1.0"
  glob:
    description:
      name: glob
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.1.1"
  html:
    description:
      name: html
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.12.2+1"
  intl:
    description:
      name: intl
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.12.7"
  logging:
    description:
      name: logging
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.11.2"
  observe:
    description:
      name: observe
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.13.4"
  package_config:
    description:
      name: package_config
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.1.3"
  path:
    description:
      name: path
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.3.9"
  petitparser:
    description:
      name: petitparser
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.5.1"
  plugin:
    description:
      name: plugin
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.1.0"
  pool:
    description:
      name: pool
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.2.1"
  protobuf:
    description:
      name: protobuf
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.5.0+1"
  smoke:
    description:
      name: smoke
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.3.6"
  source_maps:
    description:
      name: source_maps
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.10.1"
  source_span:
    description:
      name: source_span
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.2.2"
  stack_trace:
    description:
      name: stack_trace
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.6.1"
  string_scanner:
    description:
      name: string_scanner
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.1.4+1"
  utf:
    description:
      name: utf
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.9.0+3"
  watcher:
    description:
      name: watcher
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.9.7"
  when:
    description:
      name: when
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.2.0"
  which:
    description:
      name: which
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.1.3"
  yaml:
    description:
      name: yaml
      url: "https://pub.dartlang.org"
    source: hosted
    version: "2.1.8"
sdk: ">=1.14.0 <2.0.0"

EXCEPTION: type 'ShadowRootImpl' is not a subtype of type 'Element' of 'function result'. in [item.children.isNotEmpty in BwuQuickNav@25:18]
VM252:1 EXCEPTION: type 'ShadowRootImpl' is not a subtype of type 'Element' of 'function result'. in [item.children.isNotEmpty in BwuQuickNav@25:18](anonymous function) @ VM252:1
VM252:1 ORIGINAL EXCEPTION: type 'ShadowRootImpl' is not a subtype of type 'Element' of 'function result'.(anonymous function) @ VM252:1
VM252:1 ORIGINAL STACKTRACE:(anonymous function) @ VM252:1
VM252:1 #0 BrowserDomAdapter.parentElement (package:angular2/src/platform/browser/browser_adapter.dart:224:40)

1 moveNodesAfterSibling (package:angular2/src/platform/dom/dom_renderer.dart:307:20)

2 DomRenderer.attachViewAfter (package:angular2/src/platform/dom/dom_renderer.dart:152:5)

3 DebugDomRenderer.attachViewAfter (package:angular2/src/core/debug/debug_renderer.dart:86:27)

4 AppViewManager_._attachViewToContainer (package:angular2/src/core/linker/view_manager.dart:374:21)

5 AppViewManager_.createEmbeddedViewInContainer (package:angular2/src/core/linker/view_manager.dart:270:10)

6 ViewContainerRef_.createEmbeddedView (package:angular2/src/core/linker/view_container_ref.dart:146:15)

7 NgIf.ngIf= (package:angular2/src/common/directives/ng_if.dart:39:27)

8 _BwuQuickNav_3.detectChangesInRecordsInternal (package:bwu_ng_quick_nav/bwu_ng_quick_nav.template.dart:935:34)

9 AbstractChangeDetector.detectChangesInRecords (package:angular2/src/core/change_detection/abstract_change_detector.dart:151:12)

10 AbstractChangeDetector.runDetectChanges (package:angular2/src/core/change_detection/abstract_change_detector.dart:125:10)

11 AbstractChangeDetector._detectChangesContentChildren (package:angular2/src/core/change_detection/abstract_change_detector.dart:236:12)

12 AbstractChangeDetector.runDetectChanges (package:angular2/src/core/change_detection/abstract_change_detector.dart:126:10)

13 AbstractChangeDetector._detectChangesInViewChildren (package:angular2/src/core/change_detection/abstract_change_detector.dart:244:12)

14 AbstractChangeDetector.runDetectChanges (package:angular2/src/core/change_detection/abstract_change_detector.dart:128:10)

15 AbstractChangeDetector._detectChangesInViewChildren (package:angular2/src/core/change_detection/abstract_change_detector.dart:244:12)

16 AbstractChangeDetector.runDetectChanges (package:angular2/src/core/change_detection/abstract_change_detector.dart:128:10)

17 AbstractChangeDetector.detectChanges (package:angular2/src/core/change_detection/abstract_change_detector.dart:111:10)

18 ChangeDetectorRef_.detectChanges (package:angular2/src/core/change_detection/change_detector_ref.dart:209:14)

19 ApplicationRef_.tick. (package:angular2/src/core/application_ref.dart:517:63)

20 List.forEach (dart:core-patch/growable_array.dart:254)

21 ApplicationRef_.tick (package:angular2/src/core/application_ref.dart:517:32)

22 ApplicationRef_._loadComponent (package:angular2/src/core/application_ref.dart:484:10)

23 ApplicationRef_.bootstrap.. (package:angular2/src/core/application_ref.dart:446:16)

24 StackZoneSpecification.registerUnaryCallback.. (package:stack_trace/src/stack_zone_specification.dart:135:26)

25 StackZoneSpecification._run (package:stack_trace/src/stack_zone_specification.dart:206:15)

26 StackZoneSpecification.registerUnaryCallback. (package:stack_trace/src/stack_zone_specification.dart:135:14)

27 NgZone._runUnary. (package:angular2/src/core/zone/ng_zone.dart:321:40)

28 _rootRun (dart:async/zone.dart:891)

29 _ZoneDelegate.run (dart:async/zone.dart:490)

30 NgZone._run (package:angular2/src/core/zone/ng_zone.dart:291:21)

31 NgZone._runUnary (package:angular2/src/core/zone/ng_zone.dart:321:7)

32 _CustomZone.runUnary (dart:async/zone.dart:798)

33 _Future._propagateToListeners.handleValueCallback (dart:async/future_impl.dart:551)

34 _Future._propagateToListeners (dart:async/future_impl.dart:637)

35 _Future._completeWithValue (dart:async/future_impl.dart:424)

36 _Future._asyncComplete. (dart:async/future_impl.dart:479)

37 NgZone._scheduleMicrotask. (package:angular2/src/core/zone/ng_zone.dart:331:11)

38 StackZoneSpecification._run (package:stack_trace/src/stack_zone_specification.dart:206:15)

39 StackZoneSpecification.registerCallback. (package:stack_trace/src/stack_zone_specification.dart:125:48)

40 _rootRun (dart:async/zone.dart:895)

41 _ZoneDelegate.run (dart:async/zone.dart:490)

42 NgZone._run (package:angular2/src/core/zone/ng_zone.dart:291:21)

43 _CustomZone.run (dart:async/zone.dart:790)

44 _CustomZone.runGuarded (dart:async/zone.dart:696)

45 _CustomZone.bindCallback. (dart:async/zone.dart:721)

46 _microtaskLoop (dart:async/schedule_microtask.dart:41)

47 _startMicrotaskLoop (dart:async/schedule_microtask.dart:50)

48 _ScheduleImmediateHelper._handleMutation (dart:html:52073)

49 MutationObserver._create. (dart:html:28753)
@zoechi
Copy link
Contributor Author

zoechi commented Mar 10, 2016

This is quite painful because without native shadow DOM, CSS is merged into page level styles and nearly impossible to debug.

@alan-knight
Copy link
Contributor

Do you have a reproduction? Where does ShadowRootImpl come from? I don't see that class anywhere in the SDK or even in a web search. Is it possible that the reason it works in dart2js is just that it's not in checked mode?

@zoechi
Copy link
Contributor Author

zoechi commented Mar 11, 2016

I haven't found anything about ShadowRootImpl. It's also not one of my classes. I'll try to create a repo project.

zoechi pushed a commit to bwu-dart/bwu_ng_elements that referenced this issue Mar 21, 2016
@zoechigist
Repo case for dart-lang/sdk#25969
0a152f3
@zoechi
Copy link
Contributor Author

zoechi commented Mar 21, 2016

With the code in this repository https://github.com/bwu-dart/bwu_ng_elements I can reproduce.
branch: dart_sdk_issue_25969
by running: example/item/index.html

After Dartium is done loading the application I get the exception without any manual action.

When I remove *ngIf="item.length > 3" from this line
https://github.com/bwu-dart/bwu_ng_elements/blob/0a152f3bb1f285e14490b8e1d94c21ee2651d182/example/item/main.dart#L57-L57

or encapsulation: ViewEncapsulation.Native from

https://github.com/bwu-dart/bwu_ng_elements/blob/0a152f3bb1f285e14490b8e1d94c21ee2651d182/lib/item/icon_item.dart#L23

Then the exception isn't thrown.

@alan-knight
Copy link
Contributor

That code seems to depend on the non-available bwu_sass_transformer.

Presumably ViewEncapsulation.Native is telling it to use the native Shadow DOM. But that doesn't explain where ShadowRootImpl is coming from. It's not in Angular, and the only places I found it are in C++, which I doubt is what we're seeing.

Basically, someone somewhere has a ShadowRootImpl which is not an element, and in Angular's BrowserDOMAdapter they declare parentElement as returning an element when it can in fact return the ShadowRootImpl. The subclassing makes sense. In Dart ShadowRoot extends DocumentFragment, which extends Node. So

Element parentElement(Node el) => el.parentNode;

is wrong. It might reasonably return null if the parentNode is not an Element.

@zoechi
Copy link
Contributor Author

zoechi commented Mar 22, 2016

Ups sorry, missed that one.
I commited a version without the sass transformer package and CSS statically added to the same branch.

@zoechi
Copy link
Contributor Author

zoechi commented Mar 23, 2016

This exception seems similar

type 'DivElementImpl' is not a subtype of type 'String' of 'other' where
DivElementImpl is from dart:html
String is from dart:core

dart:core _StringBase.+
element_test.dart 39:22 main...
===== asynchronous gap ===========================
dart:async _Future.then
element_test.dart 38:35 main..
dart:core Function.apply
package:angular2/src/facade/lang.dart 241:21 FunctionWrapper.apply
package:angular2/src/testing/test_injector.dart 187:28 FunctionWithParamTokens.execute
package:angular2/src/testing/test_injector.dart 50:15 TestInjector.execute
package:angular2_testing/angular2_testing.dart 83:24 _runInjectableFunction
package:angular2_testing/angular2_testing.dart 115:11 ngTest..
===== asynchronous gap ===========================
dart:async Future.Future.microtask
package:angular2_testing/angular2_testing.dart ngTest.

which is caused by this unused import
https://github.com/bwu-dart-playground/dart_playground/blob/36e41264aa74e2956b38233de4a11de3e472c111/angular2/so_36046599_test_query_child/test/element_test.dart#L8

@alan-knight
Copy link
Contributor

Yes, this seems like Angular is doing some messing around. That file defines EventListener. Is that Shadowing the dart:html implementation and substituting debug/mock classes. Somehow or other Angular is playing games and returning types that don't match. Did this work in older Dartium? Does it work in dart2js compiled in checked mode?

@zoechi
Copy link
Contributor Author

zoechi commented Mar 23, 2016

I basically just started with Angular2, therefore I can't tell about older Dartium. I wasn't aware that such a messing-around is even possible. I'll try in checked mode dart2js and report back.
Thanks for checking :)

@alan-knight
Copy link
Contributor

I think these two issues are somewhat different. The shadow root one seems like a bug in Angular where it assumes the parent of an element is also an element, which is not true. The second one seems like it's returning something entirely incorrect, giving back some sort of element when a String is expected.

@zoechi
Copy link
Contributor Author

zoechi commented Mar 25, 2016

I added

- $dart2js:
    checked: true

I can't reproduce the error with this build output in Chrome.
I checked the build output in as well.

@zoechi
Copy link
Contributor Author

zoechi commented Feb 23, 2017

I'll going to close this. Didn't run into that since months.

@zoechi zoechi closed this as completed Feb 23, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@kevmoo @zoechi @alan-knight