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.

Handling Barcode Scanner Keyboard Wedge Input in React

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.

Original post: https://farazrahimi.com/posts/handling-barcode-scanner-keyboard-wedge-input-in-react