Senior frontend.
Mastered.

const save = debounce((text) => api.save(text), 500);
input.addEventListener("input", (e) => save(e.target.value));

window.addEventListener("beforeunload", () => save.flush()); // do not lose the last edit
cancelButton.onclick = () => save.cancel();

function debounce(fn, wait = 0) {
  // Your code here
}

function debounce(fn, wait = 0) {
  let timer = null;
  let savedArgs;
  let savedThis;
  let result;

  function invoke() {
    const args = savedArgs;
    const self = savedThis;
    timer = null;
    savedArgs = savedThis = undefined;
    result = fn.apply(self, args);
    return result;
  }

  function debounced(...args) {
    savedArgs = args;
    savedThis = this;
    clearTimeout(timer);
    timer = setTimeout(invoke, wait);
    return result;
  }

  debounced.cancel = function () {
    clearTimeout(timer);
    timer = null;
    savedArgs = savedThis = undefined;
  };

  debounced.flush = function () {
    if (timer === null) return result;
    clearTimeout(timer);
    return invoke();
  };

  return debounced;
}

const wait = (ms) => new Promise((resolve) => setTimeout(resolve, ms));

test("calls fn once, after the wait, with the latest arguments", async () => {
  const calls = [];
  const debounced = debounce((x) => calls.push(x), 40);
  debounced(1);
  debounced(2);
  debounced(3);
  expect(calls).toEqual([]);
  await wait(80);
  expect(calls).toEqual([3]);
});

test("restarts the timer on every call", async () => {
  let calls = 0;
  const debounced = debounce(() => calls++, 50);
  debounced();
  await wait(30);
  debounced();
  await wait(30);
  expect(calls).toBe(0);
  await wait(50);
  expect(calls).toBe(1);
});

test("keeps the this value of the latest call", async () => {
  let seen = null;
  const obj = {
    name: "editor",
    save: debounce(function () { seen = this.name; }, 10),
  };
  obj.save();
  await wait(40);
  expect(seen).toBe("editor");
});

test("cancel drops the pending call", async () => {
  let calls = 0;
  const debounced = debounce(() => calls++, 20);
  debounced();
  debounced.cancel();
  await wait(50);
  expect(calls).toBe(0);
});

test("flush runs the pending call immediately and returns its result", async () => {
  let calls = 0;
  const debounced = debounce((x) => { calls++; return x * 2; }, 50);
  debounced(4);
  expect(debounced.flush()).toBe(8);
  expect(calls).toBe(1);
  await wait(80);
  expect(calls).toBe(1);
});

test("flush with nothing pending returns the last result", async () => {
  let calls = 0;
  const debounced = debounce(() => ++calls, 10);
  expect(debounced.flush()).toBeUndefined();
  debounced();
  await wait(30);
  expect(debounced.flush()).toBe(1);
  expect(calls).toBe(1);
});

test("can be used again after it fired", async () => {
  const calls = [];
  const debounced = debounce((x) => calls.push(x), 10);
  debounced("a");
  await wait(30);
  debounced("b");
  await wait(30);
  expect(calls).toEqual(["a", "b"]);
});