WebComponentsReady never get called

Flow
1

Hi,

I am trying to create a simple Login Form following an examples from here:
https://vaadin.com/components/vaadin-login/html-examples/i18n-demos

But everything in “script” tag i moved it to ready() function in polymer.

Everything in ready() worked fine, except window.addEventListener(‘WebComponentsListener’, … ),
If I open preview in Vaadin Designer, It will be called, but if I run in debug mode, It won’t.

Here is my code:

import {html, PolymerElement} from '@polymer/polymer/polymer-element.js';
import '@vaadin/vaadin-ordered-layout/src/vaadin-vertical-layout.js';
import '@vaadin/vaadin-login/src/vaadin-login-form.js';

class LoginView extends PolymerElement {

    static get template() {
        return html`
<style include="shared-styles">
                :host {
                    display: block;
                    height: 100%;
                }
            </style>
<vaadin-vertical-layout theme="spacing" style="width: 100%; height: 100%; align-items: center; justify-content: center;">
 <vaadin-login-form id="login-form" no-forgot-password></vaadin-login-form>
</vaadin-vertical-layout>
`;
    }

    static get is() {
        return 'login-view';
    }

    static get properties() {
        return {
            // Declare your properties here.
        };
    }

    ready() {
        super.ready();
        console.log('ready');  // This will be called
        const loginForm = this.$["login-form"]
;
        window.addEventListener('WebComponentsReady', function(){
            console.log('When the web component is ready, this should be call in console');  // Only called in Vaadin Design Preview mode, not in DEBUG MODE
            loginForm.i18n = {
                header: {
                    title: 'Nome do aplicativo',
                    description: 'Descrição do aplicativo'
                },
                form: {
                    title: 'Acesse a sua conta',
                    username: 'Usuário',
                    password: 'Senha',
                    submit: 'Entrar',
                    forgotPassword: 'Esqueci minha senha'
                },
                errorMessage: {
                    title: 'Usuário/senha inválidos',
                    message: 'Confira seu usuário e senha e tente novamente.'
                },
                additionalInformation: 'Neste exemplo, use as credenciais admin/admin para um login bem-sucedido.'
            };
            console.log(loginForm.i18n)
        });
    }
}

customElements.define(LoginView.is, LoginView);