Opportunity:
Hello, I have a situation that I simply can't figure-out. I am getting these errors from Dart when I run a quite simple example:
[13288:9212:0320/161303:ERROR:navigation_entry_screenshot_manager.cc(147)] Invalid entry with unique id: 3
[14080:11508:0320/155717:ERROR:chrome_views_delegate.cc(185)] NOT IMPLEMENTED
[14080:11508:0320/155717:ERROR:desktop_root_window_host_win.cc(753)] NOT IMPLEMENTED
[14080:11508:0320/155719:ERROR:desktop_root_window_host_win.cc(753)] NOT IMPLEMENTED
[14080:11508:0320/155747:ERROR:extension_icon_image.cc(201)] Start loading extension icon for Chromium. scale = 1
The messages don't really connect to the Use-Case I'm implementing. My attempts to use debug and other tools have come to not much indeed. I have 'reduced' the problem to a simple example based on the DartPolymer example:
- Define a Custom Element tutorial.
This tutorial defines a DartPolymer component called <tut-stopwatch>
. In my example I have copied that element as two clones: <x-fred>
and <z-fred>
. Everything is identical in a diff command, except the names and tags.
The layout of the main index.html page is as follows:
<body>
<x-fred> </x-fred>
<hr/>
<h1>Stopwatch</h1>
<tut-stopwatch> </tut-stopwatch>
<hr/>
<z-fred> </z-fred>
</body>
Investigation so far:
I put a break-point on the DOM register call and the stopwatch creator (constructor):
class TuteStopwatch extends PolymerElement {
@observable String counter='00:00';
TuteStopwatch.created() : super.created();
:
}
The "unique id message" as I call it comes up:
[13288:9212:0320/161303:ERROR:navigation_entry_screenshot_manager.cc(147)] Invalid entry with unique id: 3
During debugging. There's no clear connection to the code executing and I think that this is an async message, unrelated to the registration of the <tut-stopwatch>
component.
The other two examples (different in name and a label only): <x-fred>
and <z-fred>
work fine. It is just the <tut-stopwatch>
element that poses a problem.
This is difficult for two reasons:
- I have a stand-alone
<tut-stopwatch>
example working fine. - Despite text and lexical code-compare of three bits of "congruent" code, one is flawed in a specific context. It speaks to a lack of robustness some place.
Obviously I need a bit of direction on where to look for the problem. It reminds me of those games: "One of these things is not like the other . . . "
Thanks in advance.
Code
<tut-stopwatch>
Based on: Define a Custom Element example:
// Copyright (c) 2012, the Dart project authors. Please see the AUTHORS file
// for details. All rights reserved. Use of this source code is governed by a
// BSD-style license that can be found in the LICENSE file.
import 'dart:html';
import 'dart:async';
import 'package:polymer/polymer.dart';
@CustomTag('tute-stopwatch')
class TuteStopwatch extends PolymerElement {
@observable String counter='00:00';
TuteStopwatch.created() : super.created();
Stopwatch mywatch = new Stopwatch();
Timer mytimer;
:
}
<x-fred>
@CustomTag('x-fred')
//@CustomTag('tute-stopwatch')
class XFred extends PolymerElement {
@observable String counter='00:00';
XFred.created() : super.created();
Stopwatch mywatch = new Stopwatch();
Timer mytimer;
Stopwatch mywatch = new Stopwatch();
Timer mytimer;
:
}
- Note: each element is in a different sub-folder and there is no name space collision between on the
TuteStopwatch{...}
class with<x-fred>
and<z-fred>
tut_stopwatch.html
This file is in its own folder with tute_stopwatch.dart:
elements/fred/tute_stopwatch.html
<template> <style> :host { background-color: yellow; text-align: center; display: inline-block; border: solid 1px; padding: 10px 10px 10px 10px; } </style> <div> <div> stopwatch: {{counter}} </div> <div> <button on-click="{{start}}" id="startButton">Start</button> <button on-click="{{stop}}" id="stopButton">Stop</button> <button on-click="{{reset}}" id="resetButton">Reset</button> </div> </div> </template> <script type="application/dart" src="tute_stopwatch.dart"> </script>
fred.html (<x-fred>)
This file is in its own folder with Fred.dart:
elements/fred/fred.html
<template> <style> :host { background-color: blue; text-align: center; display: inline-block; border: solid 1px; padding: 10px 10px 10px 10px; } </style> <div> <div> fred: {{counter}} </div> <div> <button on-click="{{start}}" id="startButton">Start</button> <button on-click="{{stop}}" id="stopButton">Stop</button> <button on-click="{{reset}}" id="resetButton">Reset</button> </div> </div> </template> <script type="application/dart" src="fred.dart"> </script>