I have a set of session variables that need to be shared across two files, but the variables are updated after exporting and don’t update across the two files, only in the one that has the update.

Here is my first file that exports the variable:

import { invoke } from "@tauri-apps/api/tauri";
import { classActive } from "./firebaseHelper";

let joinInputEl: HTMLInputElement | null;
let userInputEl: HTMLInputElement | null;
let joinMsgEl: HTMLElement | null;

export const session = {
  class_key: "",
  user_str: ""
}

async function join() {
  if (joinMsgEl && joinInputEl && userInputEl) {
    let success = await classActive(joinInputEl.value);

    if (!success) {
      console.log("Failed to find class in database");
      joinMsgEl.textContent = "Failed to find class, try again";
      return;
    }
    
    session.class_key = joinInputEl.value;
    session.user_str = userInputEl.value;

    joinMsgEl.textContent = `${session.class_key}, ${session.user_str}`;

    await invoke("switch_windows");
  }
}

window.addEventListener("DOMContentLoaded", () => {
  joinInputEl = document.querySelector("#class-code-input");
  userInputEl = document.querySelector("#user-input");
  joinMsgEl = document.querySelector("#join-msg");
  document.querySelector("#class-form")?.addEventListener("submit", (e) => {
    e.preventDefault();
    join();
  });
});

And here is the file that imports it and isn’t updating:

import { pushMessage } from "./firebaseHelper";
import { session } from "./main";

let questionInputEl: HTMLInputElement | null;
let questionMsgEl: HTMLElement | null;

async function submit() {
  if (questionMsgEl && questionInputEl) {
    questionMsgEl.textContent = `${session.class_key}, ${session.user_str}, ${questionInputEl.value}`;

    let success = await pushMessage(session.class_key, session.user_str, questionInputEl.value);

    if (!success) {
      console.log("Failed to push message to database");
      questionMsgEl.textContent = "Message failed to send, try again";
      return;
    }

    questionMsgEl.textContent = `${session.class_key}, ${session.user_str}, ${questionInputEl.value}`;
  }
}

window.addEventListener("DOMContentLoaded", () => {
  questionInputEl = document.querySelector("#question-input");
  questionMsgEl = document.querySelector("#question-msg");

  document.querySelector("#question-form")?.addEventListener("submit", (e) => {
    e.preventDefault();
    submit();
  });
});

I’m running in Tauri with a Firebase connected and updating text elements to look at the typescript variables.

Tried exporting individual variables, helper functions, switching which file was exporting the variables, and none of them worked properly.