Application View Migration Guide

Step 1. Change the feature name from views to appViews:

    export const avid = {
        appViews: {
        ...

or

    export const avid = [{
        name: 'companyname-projectname-app-view-name',
        provides: ['appViews'],
        ...

Step 2. Remove the createElement method and use the onRender
method for creating the view DOM structure:

Before:

createElement() {
    this.el = document.createElement('DIV');
    return Promise.resolve(this.el);
}

onRender() {
    this.el.appendChild(...);
}            
                

After:

onRender({ domElement }) {
       this.el = document.createElement('DIV');
       domElement.appendChild(this.el);
       this.el.appendChild(...);
       

Step 3. If you use the trigger method in your view methods, initialize it
in the onInit method:

onInit(config, { dispatch }) {
    this.trigger = dispatch;    
}    

If the application listens to view events, change the arguments in the event listener handlers:

Before:

this.view.on('eventName', (eventName, data) => {
    ...    
});
                

After:

this.view.on('eventName', (data) => {
        ...    
});

Step 4. To change the tab name of your application view, use the nameChange event and define the view method name:

name() {
    return this.name;
}

_onChangeNameClick() {
    this.trigger('nameChange');
}  

The method name is not a setter anymore.