RXJS Barcode scanner

Question

I am trying to listen to barcode events from Javascript (Angular). My requirement is that it should not be an input (so it should not have to be focused all the time) and my RXJS stream should emit once per scan and exclude regular keyboard strokes.

Answer 1

Here is the code I came up with. It works great, and I hope it will help anyone that is struggling with this in the future.

    const down = fromEvent(document, "keydown");

    const up = fromEvent(document, "keyup");

    const scannerKeys = up.pipe(
      filter((e: KeyboardEvent) => e.code !== "ShiftLeft"),
      withLatestFrom(down, (u: KeyboardEvent, d: KeyboardEvent) => ({
        key: `${d.key}`,
        pressTime: u.timeStamp - d.timeStamp,
        e: u,
      })),
      filter((x) => x.pressTime < 5)
    );

    this.scanned = scannerKeys.pipe(
      scan((acc, value) => {
        return value.key !== "Enter" ? acc + value.key : "";
      }, ""),
      filter((x) => x !== ""),
      debounceTime(50)
    );