Handling Barcode Scanner Keyboard Wedge Input in React
Published 2025-12-17 by Faraz Rahimi
Scanner guns type fast and hit Enter. If your inputs debounce like a search box, you will drop digits.
Tags: React, Barcodes, Warehouse, UX, unlisted
I treat wedge input as a burst: a listener that buffers rapid keydowns and submits on Enter or a timeout that is short. I do not debounce 300ms on the SKU field.
Focus management matters. After a successful scan, focus stays ready for the next beep, not on a button in a modal.
Prefixes and suffixes
Some scanners send letters around the code. I strip known wrappers. I do not silently accept a SKU that is obviously a scanner config string.
Manual typing still works
People will type when a label is gone. The same field should serve both without making typists wait for the burst timeout. It is a small state machine. It is worth it.