onChange + onClick event not batched into same render commit

Reproduction

https://codesandbox.io/s/preact-setstate-overwrite-input-moy82

Steps to reproduce

(using preact/compat)

function App() {
  console.log("rerender");
  let [checked, setChecked] = React.useState(false);

  let [, setState] = React.useState(false);
  return (
    <>
      <input
        type="checkbox"
        checked={checked}
        onChange={(e) => {
          console.log("onChange", e.target.checked);
          setChecked(e.target.checked);
        }}
        onClick={(e) => {
          console.log("onClick", e.target.checked);
          // ... or uncomment calls to fix
          setState(true);
          setState(false);
        }}
      />
      <br />
      Checked? {String(checked)}
    </>
  );
}

1. Try to toggle checkbox, doesn’t work because this happens:

onClick  true
rerender 
onChange  false

So the click was overwritten by the setState call

1. With React:

onClick  true
onChange  true
rerender 

1. Without the setState calls, it obviously works

Expected Behavior

The checkbox should toggle?

Not sure if this is something that can be fixed on the Preact side or if I need to add a workaround.

Actual Behavior

Nothing happens when clicking the checkbox.

[marvinhagemeister]

We do batch all state updates which is why the onClick handler only causes one re-render. But having a closer look it seems like our window is smaller compared to React. A quick workaround would be to enlarge the time where updates are batched:

import { options } from "preact";

options.debounceRendering = setTimeout;

[mischnic]

Thanks, though I’m not comfortable adding this line in a UI component library 😅