Aurelia-dialog BindingLanguage must implement inspectTextContent()

Question

I installed aurelia-dialog npm install aurelia-dialog --save. Which installed the version "version": "2.0.0-rc.3". I modified main.ts by adding .plugin(PLATFORM.moduleName('aurelia-dialog')) ; to aurelia.use in configure function. I added "dependencies": [ { "name": "aurelia-dialog", "path": "../node_modules/aurelia-dialog/dist/amd", "main": "aurelia-dialog", "resources": ["resources/*.js"] } ] in aurelia.json (so, I'm not sure it's usefull).

Then here is a module used to call the dialog :

import {DialogService} from 'aurelia-dialog';
import {Rapport} from '../modal/rapport';

@inject(CssAnimator,
EventAggregator,
Parameters,
Configurator,
NewInstance.of(ValidationController),
Validator,
Router,
NewInstance.of(HttpClient),
DialogService
)
export class Import {
constructor(private cssAnim: CssAnimator,
    private ea: EventAggregator,
    private params: Parameters,
    private conf: Configurator,
    private controller: ValidationController,
    private validator: Validator,
    private router: Router,
    private httpClient: HttpClient,
    private dialogService: DialogService) {
...
}
...
test(){
    let testResponse='{"FATAL":["1 ca craint !", "2","3","4"],"WARN":["w1", "w2","w3"],"INFO":["i1","i2","i3"]}';
    this.dialogService.open({
                viewModel: Rapport,
                model:testResponse
            }).whenClosed(reponse => {
                console.log("Rapport lu :) + ["+reponse.output+"]");
            });
}

My Rapport VM :

import {inject} from 'aurelia-framework';
import {DialogController} from 'aurelia-dialog';

@inject(DialogController)
export class Rapport {
    fatals: string[]=[];
    warns: string[]=[];
    infos: string[]=[];

    constructor(private controller: DialogController) {
        controller.settings.centerHorizontalOnly = true;
    }

    activate(rapportJson) {
        let rapport = JSON.parse(rapportJson);
        this.fatals = rapport.FATAL;
        console.log("fatals :"+this.fatals);
        this.warns = rapport.WARN;
        console.log("warns :"+this.warns);
        this.infos = rapport.INFO;
        console.log("infos :"+this.infos);
    }
}

My view :

<template> 
<!--    <ux-dialog>  -->
<!--        <ux-dialog-body> -->
<!--            <h2>Erreurs fatales : </h2> -->
<!--            <ul> -->
<!--            <li repeat.for="f of fatals"><span>${f}</span></li> -->
<!--            </ul> -->
<!--            <h2>Avertissements : </h2> -->
<!--            <ul> -->
<!--            <li repeat.for="w of warns"><span>${w}</span></li> -->
<!--            </ul> -->
<!--            <h2>Pour information : </h2> -->
<!--            <ul> -->
<!--            <li repeat.for="i of infos"><span>${i}</span></li> -->
<!--            </ul> -->
<!--        </ux-dialog-body>  -->
<!--        <ux-dialog-footer> -->
<!--            <button class="btn btn-success"   click.delegate="controller.ok()" >Ok</button> -->
<!--        </ux-dialog-footer>  -->
<!--    </ux-dialog>  -->
</template>

Everything in commented but without this it doesn't work the same :(

When I click on the button test (see class Import), then nothing appends and I have these traces :

fatals :1 ca craint !,2,3,4 rapport:27:9

warns :w1,w2,w3 rapport:29:9

infos :i1,i2,i3 rapport:31:9

DEBUG [templating] importing resources for modal/rapport.html Array [ ] aurelia-logging-console:20:6

Unhandled rejection Error: BindingLanguage must implement inspectTextContent().

mi@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:892:9

inspectTextContent@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:909:5

_compileNode@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:2824:26

_compileNode@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:2844:26

compile@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:2791:5

loadViewFactory/</registryEntry.onReady<@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:3518:27

From previous event:

loadViewFactory/<@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:3511:31

From previous event:

loadViewFactory@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:3493:12

loadViewFactory@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:617:12

load@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:4274:14

createController/<@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:4883:14

From previous event:

createController@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:4871:12

_createControllerAndSwap@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:4843:12

compose@webpack-internal:///./node_modules/aurelia-dialog/node_modules/aurelia-templating/dist/native-modules/aurelia-templating.js:4945:14

DialogService.prototype.composeAndShowDialog@webpack-internal:///./node_modules/aurelia-dialog/dist/native-modules/dialog-service.js:79:16

DialogService.prototype.open/openResult<@webpack-internal:///./node_modules/aurelia-dialog/dist/native-modules/dialog-service.js:141:20

From previous event:

DialogService.prototype.open@webpack-internal:///./node_modules/aurelia-

dialog/dist/native-modules/dialog-service.js:131:26

Import.prototype.test@webpack-internal:///import/import:279:9

evaluate@webpack-internal:///./node_modules/aurelia-binding/dist/native-modules/aurelia-binding.js:1578:14

callSource@webpack-internal:///./node_modules/aurelia-binding/dist/native-modules/aurelia-binding.js:5269:18

handleEvent@webpack-internal:///./node_modules/aurelia-binding/dist/native-modules/aurelia-binding.js:5278:5

handleDelegatedEvent@webpack-internal:///./node_modules/aurelia-binding/dist/native-modules/aurelia-binding.js:3353:11

What's wrong ? I can't find any answer in Aurelia blog or anywhere else ...

Answer 1

You know what ?

I made npm install -g aurelia-cli ; it updates Aurelia.

In another directory, I made a au new and then installed all packages that I need (included aurelia-dialog). Copy/paste all src files from the previous place, and ... it works !!

So if you have trouble with Aurelia-dialog (and other plugins, I guess) be sure Aurelia is updated to the last version. Hope my loss of time will help someone else not to loose his time ...