// main.js

import { generate_password } from './static/wasm.js';

const websiteInput = document.getElementById('website');
const emailInput = document.getElementById('email');
const keyInput = document.getElementById('key');
const copyButton = document.getElementById('copy-password'); // Updated ID

// Function to get the current tab's URL
async function getCurrentTabUrl() {
  console.log('getCurrentTabUrl() called');
  const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
  console.log('getCurrentTabUrl() returned ', tab.url);
  return clean_url(tab.url); // why does this not work? Error: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading '__wbindgen_add_to_stack_pointer')
  // return tab.url;
}

async function saveEmail(email) {
  console.log('saveEmail() called');
  await chrome.storage.local.set({ 'email': email });
}

async function autofillEmail() {
  console.log('autofillEmail() called');
  const data = await chrome.storage.local.get('email');
  const savedEmail = data.email || '';
  emailInput.value = savedEmail;
}

getCurrentTabUrl().then(url => {
  websiteInput.value = url;
  console.log('getCurrentTabUrl() returned', url);
});

window.addEventListener('load', async () => {
  websiteInput.value = await getCurrentTabUrl();
  await autofillEmail();
});

emailInput.addEventListener('input', async () => {
  await saveEmail(emailInput.value);
});

function clean_url(url) { // Cleans urls: eg. https://github.com/GageHoweTamu/PWGen -> github.com
  const start = url.indexOf("://") >= 0 ? url.indexOf("://") + 3 : 0;
  const end = url.slice(start).indexOf('/') >= 0 ? url.slice(start).indexOf('/') : url.length - start;
  return url.slice(start, start + end);


}


copyButton.addEventListener('click', async () => { // generate and copy password

  const website = websiteInput.value.trim();
  const email = emailInput.value.trim();
  const key = keyInput.value.trim();

  if (!website || !email || !key) {
    alert('Please fill all fields');
    return;
  }

  const password = generate_password(email, website, key);

  saveEmail(email);

  navigator.clipboard.writeText(password);
  alert('Password copied to clipboard!');
  console.log('Password copied to clipboard');
});

// lib.rs
// Compile with "wasm-pack build --target web --out-name wasm --out-dir ./static"

use sha2::{Digest, Sha256};
use wasm_bindgen::prelude::*;

// GENERATE_PASSWORD FUNCTION: TAKES EMAIL, WEBSITE, AND KEY AS INPUT AND RETURNS A PASSWORD

#[wasm_bindgen]
pub fn generate_password(email: &str, website: &str, key: &str) -> String {
    let input = format!("{}{}{}", email, website, key);
    let mut hasher = Sha256::new();
    hasher.update(input);
    let result = hasher.finalize();

    let password = format!("{:x}", result);

    println!("printing from lib.rs, password: {}", password);

    password
}

<!-- File: index.html -->

<!-- web dev is cool-->

<!DOCTYPE html>
<html lang="en">
<head> 
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Password Generator Extension</title>
    <link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
    <h1>PWGen</h1>
    <p>Fill in the following details:</p>
    <form>
        <label for="website">Website:</label><br>
        <input type="text" id="website" name="website"><br>
        <label for="email">Email:</label><br>
        <input type="text" id="email" name="email"><br>
        <label for="key">Key (Password):</label><br>
        <input type="password" id="key" name="key"><br><br>
        <button type="button" id="copy-password">Copy Password</button>

    </form>
    <script type="module" src="./main.js"></script>
</body>
</html>

I get this error when clicking the copy button:

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading '__wbindgen_add_to_stack_pointer')
Context
index.html
Stack Trace
static/wasm.js:108 (anonymous function)

let wasm;

let WASM_VECTOR_LEN = 0;

let cachedUint8Memory0 = null;

function getUint8Memory0() {
    if (cachedUint8Memory0 === null || cachedUint8Memory0.byteLength === 0) {
        cachedUint8Memory0 = new Uint8Array(wasm.memory.buffer);
    }
    return cachedUint8Memory0;
}

const cachedTextEncoder = (typeof TextEncoder !== 'undefined' ? new TextEncoder('utf-8') : { encode: () => { throw Error('TextEncoder not available') } } );

const encodeString = (typeof cachedTextEncoder.encodeInto === 'function'
    ? function (arg, view) {
    return cachedTextEncoder.encodeInto(arg, view);
}
    : function (arg, view) {
    const buf = cachedTextEncoder.encode(arg);
    view.set(buf);
    return {
        read: arg.length,
        written: buf.length
    };
});

function passStringToWasm0(arg, malloc, realloc) {

    if (realloc === undefined) {
        const buf = cachedTextEncoder.encode(arg);
        const ptr = malloc(buf.length, 1) >>> 0;
        getUint8Memory0().subarray(ptr, ptr + buf.length).set(buf);
        WASM_VECTOR_LEN = buf.length;
        return ptr;
    }

    let len = arg.length;
    let ptr = malloc(len, 1) >>> 0;

    const mem = getUint8Memory0();

    let offset = 0;

    for (; offset < len; offset++) {
        const code = arg.charCodeAt(offset);
        if (code > 0x7F) break;
        mem[ptr + offset] = code;
    }

    if (offset !== len) {
        if (offset !== 0) {
            arg = arg.slice(offset);
        }
        ptr = realloc(ptr, len, len = offset + arg.length * 3, 1) >>> 0;
        const view = getUint8Memory0().subarray(ptr + offset, ptr + len);
        const ret = encodeString(arg, view);

        offset += ret.written;
    }

    WASM_VECTOR_LEN = offset;
    return ptr;
}

let cachedInt32Memory0 = null;

function getInt32Memory0() {
    if (cachedInt32Memory0 === null || cachedInt32Memory0.byteLength === 0) {
        cachedInt32Memory0 = new Int32Array(wasm.memory.buffer);
    }
    return cachedInt32Memory0;
}

const cachedTextDecoder = (typeof TextDecoder !== 'undefined' ? new TextDecoder('utf-8', { ignoreBOM: true, fatal: true }) : { decode: () => { throw Error('TextDecoder not available') } } );

if (typeof TextDecoder !== 'undefined') { cachedTextDecoder.decode(); };

function getStringFromWasm0(ptr, len) {
    ptr = ptr >>> 0;
    return cachedTextDecoder.decode(getUint8Memory0().subarray(ptr, ptr + len));
}
/**
* @param {string} email
* @param {string} website
* @param {string} key
* @returns {string}
*/
export function generate_password(email, website, key) {
    let deferred4_0;
    let deferred4_1;
    try {
        const retptr = wasm.__wbindgen_add_to_stack_pointer(-16);
        const ptr0 = passStringToWasm0(email, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc);
        const len0 = WASM_VECTOR_LEN;
        const ptr1 = passStringToWasm0(website, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc);
        const len1 = WASM_VECTOR_LEN;
        const ptr2 = passStringToWasm0(key, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc);
        const len2 = WASM_VECTOR_LEN;
        wasm.generate_password(retptr, ptr0, len0, ptr1, len1, ptr2, len2);
        var r0 = getInt32Memory0()[retptr / 4 + 0];
        var r1 = getInt32Memory0()[retptr / 4 + 1];
        deferred4_0 = r0;
        deferred4_1 = r1;
        return getStringFromWasm0(r0, r1);
    } finally {
        wasm.__wbindgen_add_to_stack_pointer(16);
        wasm.__wbindgen_free(deferred4_0, deferred4_1, 1);
    }
}

Why is the error occurring? It only happens when I call a wasm function