.ts files not being called when new windows are restored

I am working with the sample application and wanted to add some functionality to the desktop window, but I cannot get the desktop.ts file to run, here is how the desktop.ts file is setup:

import { AppWindow } from "../AppWindow";

import { windowNames } from "../../consts";

import $ = require("jquery");

new AppWindow(windowNames.desktop);

class Desktop {

    private static _instance: Desktop;

    private constructor() {

        const loginButton = document.getElementById('loginButton');

        loginButton.addEventListener('click', () => {

            alert("clicked");
          });
    }

And I have changed the way it is called from the background.ts file:

public async run() {

    this._hearthstoneGameListener.start();

    const currWindow = windowNames.desktop;

    this._windows[currWindow].restore();

  }

But when I load the application, the click event for the login button is not working and it seems like the desktop.ts file is not being called with the window.restore?

I used to have this event listener inside of the appwindow.ts file and it worked fine, but I assumed that it would be better to have this sort of functionality inside of the desktop.ts folder as that is the window which holds my HTML for the first view the user will see.

Please can someone clear up what I’m doing wrong and the correct way to go about navigating through an OW app cleanly?

1 Like

Hi,
The sample app demonstrates the right architecture to build an OW app: a background window that acts as an “event bus” and a router for all the other windows. And two other windows: a desktop window that can run only on desktop and an in-game window that runs only overlay the game.

The appwindow.ts is just a base class, so probably you changed the code to create some issues with the above architecture.

For example, skipping obtainDeclaredWindow() and calling restore() with the window’s name will not work unless the window is already instantiated and minimized (in which case it will be restored).

I hope that it’s now clear and makes sense.

1 Like

Looks like I have a similar issue after porting our app from JavaScript to TypeScript my settings window won’t load properly. It shows the HTML page but the TS class is not instantiated.
Searching the code for obtainDeclaredWindow() does not yield any result.

I’ll inspect the background window code and maybe add my settings window to that windows dictionary see how that goes.

EDIT: Looks like all I needed was export my TS file from webpack.config.js. Just adding the following line in the module export list did the trick:

settings: './src/settings/settings.ts',

I had exported the HTML properly but failed to do the same with the corresponding TS module.