TypeError: Cannot read property 'createElement' of undefined

[DavidSolari]

I'm trying to create a widget in 4.11 and I'm getting the titular error. The traceback doesn't extend past the library code so I have no idea what part of my code actually causes the error, although my last breakpoint is at the widget's render function. I've attached my entire project (run "npm install; npm start" to build it and spin up a local web server) and I've pasted the main widget code below.

/// <amd-dependency path="esri/core/tsSupport/declareExtendsHelper" name="__extends" />
/// <amd-dependency path="esri/core/tsSupport/decorateHelper" name="__decorate" />

import { declared, property, subclass, aliasOf } from "esri/core/accessorSupport/decorators";
import { renderable, tsx } from "esri/widgets/support/widget";
import TimeSliderVM, { TimeExtent } from "./TimeSliderVM";

import Widget = require("esri/widgets/Widget");

@subclass("ledcor.gis.widgets.TimeSlider")
export default class TimeSlider extends declared(Widget) {

 @property()
 viewModel: TimeSliderVM

 @property()
 @renderable()
 @aliasOf("viewModel.currentTime")
 currentTime: Date

 @property()
 @renderable()
 @aliasOf("viewModel.extent")
 extent: TimeExtent

 constructor(start: Date, end: Date, current?: Date, params?: Partial<__esri.WidgetProperties>) {
 super(params);
 this.viewModel = new TimeSliderVM(start, end, current);
 }

 async _onClick(e: Event) {
 this.viewModel.currentTime = new Date()
 }

 render() {
 return (
 <div class="esri-widget">
 <h3>Time Slider</h3>
 </div>
 );
 }
}‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Any help is appreciated, thank you!

[MattiasEkman]

Hi!

I am not sure if you got any help with this or not (hopefully you solved it by now), but I got the same error when taking my first stumbling steps at creating a widget, so I had a look at your code (googled the error and found this question). I found out, that if I changed the contructor (in your TimeSlider.tsx) to this:

constructor(params?: any) {
   super();
}

instead of yours:

constructor(start: Date, end: Date, current?: Date, params?: Partial<__esri.WidgetProperties>) {
   super(params);
   this.viewModel = new TimeSliderVM(start, end, current);
}

then the error didn´t happen. Then of course you need to change the call to creating a new TimeSlider (in main.ts) from:

const timeSlider = new TimeSlider(start, end, now);

To something like this:

const timeSlider = new TimeSlider({
   container: "widgetDiv",
   view: view
});

And now you should at least se a div on the right having the text 'Time Slider'. After that you still have lots of work to do before the TimeSlider actually works, but this is perhaps a start. And if someone else gets the same error, this might be a help.

By the way, I used JavaScript API 4.13 and hade the same error.