How to use the tabris.WebView function in tabris

import {TextInput, WebView, contentView} from 'tabris';

// Create a web view to show a web page

const urlInput = new TextInput({
  left: 8, right: 8, top: 8,
  message: 'Enter URL...',
  text: 'http://en.wikipedia.org'
}).on('accept', loadUrl)
  .appendTo(contentView);

const webView = new WebView({
  left: 0, top: 'prev() 8', right: 0, bottom: 0
}).appendTo(contentView);

function loadUrl() {
  webView.url = urlInput.text;
}

loadUrl();

import {WebView} from 'tabris';

let widget = new WebView();

const canGoBack = widget.canGoBack;
widget = new WebView({canGoBack});
widget.set({canGoBack});
widget.canGoBack = canGoBack;

const canGoForward = widget.canGoForward;
widget = new WebView({canGoForward});
widget.set({canGoForward});
widget.canGoForward = canGoForward;

/*Expected
(6,
(7,
(8,
canGoBack

(11,
(12,

import {WebView} from 'tabris';

let widget = new WebView();

const canGoBack = widget.canGoBack;
widget = new WebView({canGoBack});
widget.set({canGoBack});
widget.canGoBack = canGoBack;

const canGoForward = widget.canGoForward;
widget = new WebView({canGoForward});
widget.set({canGoForward});
widget.canGoForward = canGoForward;

/*Expected
(6,
(7,
(8,
canGoBack

import {WebView} from 'tabris';

let widget = new WebView();

const canGoBack = widget.canGoBack;
widget = new WebView({canGoBack});
widget.set({canGoBack});
widget.canGoBack = canGoBack;

const canGoForward = widget.canGoForward;
widget = new WebView({canGoForward});
widget.set({canGoForward});
widget.canGoForward = canGoForward;

/*Expected
(6,
(7,
(8,
canGoBack

(11,
(12,
(13,
canGoForward
*/

const forward = new ImageView({
  left: back, width: NAV_SIZE, top: MARGIN, bottom: ['#webView', MARGIN],
  highlightOnTouch: true,
  image: {src: 'resources/arrow-forward-black-24dp@3x.png', scale: 3}
}).onTap(() => webView.goForward())
  .appendTo(contentView);

const urlInput = new TextInput({
  id: 'urlInput',
  left: [forward, MARGIN], top: MARGIN, right: MARGIN,
  floatMessage: false
}).onAccept(() => webView.url = urlInput.text)
  .appendTo(contentView);

const webView = new WebView({
  id: 'webView',
  left: 0, top: [urlInput, MARGIN], right: 0, bottom: 0,
  url: 'http://en.wikipedia.org'
}).onLoad(updateNavigation)
  .appendTo(contentView);

function updateNavigation() {
  urlInput.text = webView.url;
  updateNavigationButton(back, webView.canGoBack);
  updateNavigationButton(forward, webView.canGoForward);
}

function updateNavigationButton(button, enabled) {
  button.enabled = enabled;
  button.opacity = enabled ? 0.70 : 0.20;
}

_createUI() {
    this.append(
      new WebView({url: WEB_PAGE_URL})
    );
  }

BACKGROUNDS.forEach((gradient) => {
  const composite = new Composite({
    left: 0, right: 0, top: 'prev() 16',
    padding: {bottom: 8}
  }).appendTo(scrollView);
  new Composite({
    left: 16, top: 0, right: ['50%', 8], height: 96,
    background: gradient
  }).appendTo(composite);
  new WebView({
    left: ['50%', 8], top: 0, right: 16, height: 96,
    html: `
             
             
           `
  }).appendTo(composite);
  new TextView({
    left: 16, top: 'prev() 8', right: 16,
    alignment: 'centerX',
    text: gradient,
    font: '10px monospace'
  }).appendTo(composite);
});

function createDetailsPage(data) {
  const detailsPage = new Page({
    background: 'black',
    title: data.title
  }).appendTo(navigationView);
  if (data.url.substr(-4, 4) === '.jpg') {
    new ImageView({
      left: 0, top: 0, right: 0, bottom: 0,
      image: data.url,
      scaleMode: 'fit',
      zoomEnabled: true
    }).appendTo(detailsPage);
  } else {
    new WebView({
      left: 0, top: 0, right: 0, bottom: 0,
      url: data.url
    }).appendTo(detailsPage);
  }
}

text: 'Send message to WebView'
}).onSelect(() => webView.postMessage('Hello from Tabris.js', '*'))
  .appendTo(contentView);

const statusTextView = new TextView({
  left: 16, right: 16, bottom: 'prev()', height: 48,
  alignment: 'centerX',
  text: 'No message received from WebView'
}).appendTo(contentView);

new Composite({
  left: 0, right: 0, bottom: 'prev()', height: 1,
  background: '#e1e1e1'
}).appendTo(contentView);

const webView = new WebView({
  left: 0, top: 0, right: 0, bottom: 'prev()'
}).appendTo(contentView);

fetch('./resources/website.html')
  .then(result => result.text())
  .then(text => webView.html = text);

webView.onMessage(({data}) => statusTextView.text = 'Message received: ' + data);

_openPluginInfoPage() {
    contentView.find('NavigationView').first().append(
      new Page({title: 'Plugin Info'}).append(
        new WebView({
          left: 0, top: 0, right: 0, bottom: 0,
          url: 'https://www.npmjs.com/package/' + this.pluginId
        })
      )
    );
  }