Collect dependencies subsequent runs `bau.derive`

[louwers]

bau.derive collects the dependencies automatically when the derivation function is called for the first time.

In Vue this actually works:

<script setup>
import { ref, computed } from 'vue'

const msg = ref("");
const count = ref(0);

const mycomputedval = computed(() => {
  if (!msg.value) return "";
  if (!count.value) return "";

  return `${msg.value}, ${count.value}`;
});

function onClick() {
  if (!msg.value) {
    msg.value = "hello world";
    return;
  }
  
  count.value += 1;
}
</script>

<template>
  <h1>{{ mycomputedval }}</h1>
  <button @click="onClick">Press me</button>
</template>

I think similarly bau.derive should collect dependencies on subsequent runs.

[FredericHeem]

thanks a lot for the report, should be fixed in #163

[louwers]

Thanks for getting back so quickly.

test("bau derive", () => {
  const bau = Bau();
  const a = bau.state(false);
  const b = bau.state(false);
  const derived = bau.derive(() => {
    if (!a.val) return null;
    if (!b.val) return null;
    return true;
  });
  console.log(derived.val, "expected null");
  a.val = true;
  b.val = true;
  console.log(derived.val, "expected true");
});

Will print undefined, undefined.

This one works will print 1 1 1 (expected 1 2 3).

test("bau derive, incrementing", () => {
  const bau = Bau();
  const a = bau.state(false);
  const b = bau.state(false);
  const derived = bau.derive(() => {
    if (!a.val) return 1;
    if (!b.val) return 2;
    return 3;
  });

  console.log(derived.val, "expected 1");
  a.val = true;
  console.log(derived.val, "expected 2");
  b.val = true;
  console.log(derived.val, "expected 3");
});

However when I run the second one from the browser console it does print 1 2 3 as expected.

[louwers]

Added tests here, I think it is a different issue where derived values do not update synchronously.

#164