Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 34 additions & 8 deletions .github/workflows/build.yml
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,13 @@ jobs:
- name: Run integration test
run: npm run test:integration

- name: Upload release artifacts
if: matrix.os == 'ubuntu-latest'
uses: actions/upload-artifact@v4
with:
name: release-artifacts
path: artifacts/

create-release:
if: github.ref == 'refs/heads/release'
needs: build-and-test
Expand All @@ -64,11 +71,14 @@ jobs:
uses: actions/setup-node@v6
with:
node-version: 24
cache: npm
package-manager-cache: false
registry-url: https://registry.npmjs.org

- name: Install dependencies
run: npm ci
- name: Download release artifacts
uses: actions/download-artifact@v4
with:
name: release-artifacts
path: artifacts

- name: Derive release version
id: version
Expand All @@ -83,25 +93,41 @@ jobs:
- name: Apply release version
run: npm version "${{ steps.version.outputs.release_version }}" --no-git-tag-version

- name: Build package
run: npm run build

- name: Create npm package
id: package
shell: bash
run: |
VERSION="${{ steps.version.outputs.release_version }}"
SHORT_SHA="${GITHUB_SHA::7}"
TAG="v${VERSION}-${SHORT_SHA}"
PACKAGE_TGZ="$(npm pack --silent)"
PACKAGE_TGZ="$(npm pack --ignore-scripts --silent)"

echo "version=${VERSION}" >> "$GITHUB_OUTPUT"
echo "short_sha=${SHORT_SHA}" >> "$GITHUB_OUTPUT"
echo "tag=${TAG}" >> "$GITHUB_OUTPUT"
echo "package_tgz=${PACKAGE_TGZ}" >> "$GITHUB_OUTPUT"

- name: Debug publish context
shell: bash
env:
GITHUB_REPOSITORY_VALUE: ${{ github.repository }}
GITHUB_WORKFLOW_VALUE: ${{ github.workflow }}
GITHUB_WORKFLOW_REF_VALUE: ${{ github.workflow_ref }}
GITHUB_EVENT_NAME_VALUE: ${{ github.event_name }}
GITHUB_REF_VALUE: ${{ github.ref }}
GITHUB_SHA_VALUE: ${{ github.sha }}
run: |
echo "github.repository=$GITHUB_REPOSITORY_VALUE"
echo "github.workflow=$GITHUB_WORKFLOW_VALUE"
echo "github.workflow_ref=$GITHUB_WORKFLOW_REF_VALUE"
echo "github.event_name=$GITHUB_EVENT_NAME_VALUE"
echo "github.ref=$GITHUB_REF_VALUE"
echo "github.sha=$GITHUB_SHA_VALUE"
echo "package.name=$(node -p "require('./package.json').name")"
echo "package.repository.url=$(node -p "require('./package.json').repository.url")"

- name: Publish to npm
run: npm publish --access public --provenance
run: npm publish --ignore-scripts --access public

- name: Create GitHub release
env:
Expand Down
43 changes: 33 additions & 10 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,19 +1,36 @@
# QR Scanner

JavaScript QR Code Scanner based on [Cosmo Wolfe's javascript port](https://github.com/cozmo/jsqr) of [Google's ZXing library](https://github.com/zxing/zxing); see also the orphaned upstream npm package [`qr-scanner`](https://www.npmjs.com/package/qr-scanner).

In this library, several improvements have been applied over the original port:
A lightweight, fast JavaScript QR code scanner for the browser. Supports scanning a continuous video stream from a web cam as well as scanning of single images.

**[🔍 Live demo](https://qr-scanner.codeuctivity.cloud/)**  ·  **[📦 npm package](https://www.npmjs.com/package/@codeuctivity/qr-scanner)**  ·  **[GitHub](https://github.com/Codeuctivity/qr-scanner)**

## Contents

- [Features](#features)
- [Installation](#installation)
- [Setup](#setup)
- [Usage](#usage)
- [Web Cam Scanning](#web-cam-scanning)
- [Single Image Scanning](#single-image-scanning)
- [Checking for Camera availability](#checking-for-camera-availability)
- [Getting the list of available Cameras](#getting-the-list-of-available-cameras)
- [Specifying which camera to use](#specifying-which-camera-to-use)
- [Color Inverted Mode](#color-inverted-mode)
- [Color Correction](#color-correction)
- [Flashlight support](#flashlight-support)
- [Clean Up](#clean-up)
- [Build the project](#build-the-project)
- [Integration test](#integration-test)
- [Background & credits](#background--credits)

## Features

- Web cam scanning support out of the box
- Uses the browser's native [BarcodeDetector](https://web.dev/shape-detection/) [if available](https://github.com/WICG/shape-detection-api#overview)
- Lightweight: ~59.3 kB (~16.3 kB gzipped) minified with Google's closure compiler. If the native `BarcodeDetector` is available, only ~15.3 kB (~5.6 kB gzipped) are loaded.
- Improved performance and reduced memory footprint.
- Runs in a WebWorker which keeps the main / UI thread responsive.
- Can be configured for better performance on colored QR codes.

According to [our benchmarking](https://github.com/danimoh/qr-scanner-benchmark) this project's scanner engine's detection rate is about 2-3 times (and up to 8 times) as high as the one of the most popular javascript QR scanner library [LazarSoft/jsqrcode](https://github.com/LazarSoft/jsqrcode). Also the other library oftentimes misreads the content of QR codes, while for this project no misreads occurred in the benchmarking.

The library supports scanning a continuous video stream from a web cam as well as scanning of single images.
- Improved performance and reduced memory footprint
- Runs in a WebWorker which keeps the main / UI thread responsive
- Can be configured for better performance on colored QR codes

## Installation

Expand Down Expand Up @@ -267,3 +284,9 @@ Install dependencies, install the Chromium test browser, then run:
npx playwright install chromium
npm run test:integration
```

## Background & credits

JavaScript QR Code Scanner based on [Cosmo Wolfe's javascript port](https://github.com/cozmo/jsqr) of [Google's ZXing library](https://github.com/zxing/zxing); see also the orphaned upstream npm package [`qr-scanner`](https://www.npmjs.com/package/qr-scanner).

According to [our benchmarking](https://github.com/danimoh/qr-scanner-benchmark) this project's scanner engine's detection rate is about 2-3 times (and up to 8 times) as high as the one of the most popular javascript QR scanner library [LazarSoft/jsqrcode](https://github.com/LazarSoft/jsqrcode). Also the other library oftentimes misreads the content of QR codes, while for this project no misreads occurred in the benchmarking.
Loading