Using CoreScaffold and CoreTabs classes now causes Exception - dart

Question

I have a polymer element called main-app:
<link rel="import" href="../../packages/polymer/polymer.html">
<link rel="import" href="../../packages/paper_elements/paper_input.html">
<link rel="import" href="../../packages/paper_elements/paper_input.html">
<link rel="import" href="../../packages/paper_elements/paper_tabs.html">
<link rel="import" href="../../packages/paper_elements/paper_dialog.html">
<link rel="import" href="../../packages/paper_elements/paper_icon_button.html">
<link rel="import" href="../../packages/core_elements/core_toolbar.html">
<link rel="import" href="../../packages/core_elements/core_scaffold.html">
<link rel="import" href="../../packages/core_elements/core_header_panel.html">
<link rel="import" href="../../packages/core_elements/core_menu.html">
<link rel="import" href="../../packages/core_elements/core_item.html">
<link rel="import" href="../../packages/paper_elements/paper_input.html">
<link rel="import" href="../../packages/paper_elements/paper_button.html">
<link rel="import" href="../../packages/paper_elements/paper_dialog.html">
<link rel="import" href="../../packages/core_elements/core_scaffold.html">
<link rel="import" href="../../packages/core_elements/core_pages.html">
<polymer-element name="main-app" class="dark-primary-color">
<template>
<style type="text/css">
:host {
display: block;
}
</style>
<core-scaffold>
<core-header-panel id="menu-panel" navigation flex>
<core-toolbar id="navheader">
<span>Menu</span>
</core-toolbar>
<core-menu>
<core-item label="Home" on-click="{{homeClicked}}"></core-item>
<core-item label="About Us" on-click="{{aboutClicked}}"></core-item>
<core-item label="Contact Us" on-click="{{contactClicked}}"></core-item>
</core-menu>
</core-header-panel>
<span tool>{{title}}</span>
<paper-tabs class="main-menu bottom fit" selected="0">
<paper-tab on-click="{{homeClicked}}">Home</paper-tab>
<paper-tab on-click="{{aboutClicked}}">About Us</paper-tab>
<paper-tab on-click="{{contactClicked}}">Contact Us</paper-tab>
</paper-tabs>
<div class="content" forceNarrow>
<p>Lorem ipsum ...</p>
</div>
...
</core-scaffold>
</template>
<script type="application/dart" src="main-app.dart"></script>
</polymer-element>
main-app.dart:
import 'package:polymer/polymer.dart';
import 'util/util.dart';
import 'event/event.dart';
import 'dart:html';
import 'page/home-page.dart';
import 'page/about-page.dart';
import 'page/contact-page.dart';
#CustomTag('main-app')
class MainApp extends PolymerElement {
#observable String page = "home";
#observable String title = "Home";
MainApp.created() : super.created();
...
homeClicked(event, detail, target) {
CoreScaffold e = shadowRoot.querySelector('core-scaffold');
e.doSomething <<-- fails
...
}
...
}
This is the exception I'm getting:
Exception: 'package:falm/main-app.dart': malformed type: line 73 pos 5: type 'CoreScaffold' is not loaded
CoreScaffold e = shadowRoot.querySelector('core-scaffold');
^
type 'CoreScaffold' is not a subtype of type 'malformed' of 'e'.
To get rid of the exception, I now have to do:
homeClicked(event, detail, target) {
Element e = shadowRoot.querySelector('core-scaffold');
e.doSomething <<-- works
...
}
The code that is failing was working until a dart update yesterday morning (not sure from which version I updated as I reinstalled the SDK completely before doing a full pub upgrade, pub cache repair and pub download), PaperTabs is doing the same thing.
Does this mean I can no longer use CoreElement and PaperTabs classes in my dart code?
Update: here are the relevant bits and pieces from pubspec.lock:
core_elements:
description: core_elements
source: hosted
version: "0.6.0+4"
paper_elements:
description: paper_elements
source: hosted
version: "0.6.0+4"
polymer:
description: polymer
source: hosted
version: "0.15.5"
polymer_expressions:
description: polymer_expressions
source: hosted
version: "0.13.0+1"
web_components:
description: web_components
source: hosted
version: "0.10.1"

Answer 1

You need to import the libraries where the class is defined.
import 'package:core_elements/core_scaffold.dart';
import 'package:paper_elements/paper_tabs.dart';
checked/unchecked
When you run a Dart script from command line the default is production mode (unchecked mode). dart bin/somescript.dart, or checked mode when set explicitely like dart -c bin/somescript.dart.
When you launch a Dart script or web app from DartEditor default is checked mode. DartEditor allows to (de)activate Run in checked mode in Manage Launches (run configurations).
I assume there is a similar setting in Dart plugin for Eclipse (don't use it myself).
WebStorm allows to set it for command line apps in Run > Edit Configurations ... . For web apps you can create a new browser config and add --checked in the Command line options.
I assume it's similar in IntelliJ IDEA but I haven't used it myself yet.
See also https://stackoverflow.com/a/21658630/217408