feat: miniprogram

[Sec-ant]

Summary by CodeRabbit

• New Features

  • Enhanced barcode reading to accept additional input formats (ArrayBuffer and Uint8Array) for greater flexibility.
  • Added support for WeChat Mini Programs with updated build outputs and runtime considerations.

• Documentation

  • Updated user guides to reflect the new input options and to provide specific instructions for integrating with WeChat Mini Programs.

• Tests

  • Expanded test coverage to ensure robust handling of multiple input types in barcode scanning.

[changeset-bot]

🦋 Changeset detected

Latest commit: 7972b83

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
zxing-wasm	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[coderabbitai]

Walkthrough

This update introduces several modifications to the "zxing-wasm" package. It expands the accepted input types for the readBarcodes function across multiple modules, updates documentation with WeChat Mini Program instructions, and integrates a new miniprogram build process. In addition, build scripts now include cleanup steps and new configurations, while tests are enhanced to cover various input formats. A new dev dependency is also added to aid development.

Changes

File(s)	Change Summary
.changeset/pink-tips-unite.md, .changeset/pretty-ravens-send.md	Added a minor version update for zxing-wasm and updated the readBarcodes signature to accept ArrayBuffer and Uint8Array.
README.md	Revised documentation for readBarcodes input types and added a dedicated section for WeChat Mini Program usage instructions.
package.json	Introduced a new "miniprogram" entry, added a "build:miniprogram" script, integrated it into the overall build command, and included @napi-rs/canvas as a new dev dependency.
scripts/build-cjs.ts	Inserted a cleanup step (using rimraf) to delete the dist/cjs directory before building.
scripts/build-miniprogram.ts	Added a new build script that removes the existing dist/miniprogram directory, builds using Vite in miniprogram mode, and writes a package.json file to the output directory.
src/full/index.ts, src/reader/index.ts	Updated the readBarcodes function to include ArrayBuffer and Uint8Array as accepted input types in addition to Blob and ImageData.
src/share.ts	Refactored readBarcodesWithFactory for broader input handling, introduced conditional WASM instantiation for miniprogram mode, and added a minimal Blob polyfill.
tests/unit.test.ts	Enhanced test coverage for readBarcodes by validating functionality with multiple input types and adding necessary imports and setup for the ZXing WASM module.

Sequence Diagram(s)

sequenceDiagram
    participant BM as Build-Miniprogram Script
    participant R as rimraf Module
    participant V as Vite
    participant FS as File System

    BM->>R: Remove "dist/miniprogram" directory
    BM->>V: Invoke Vite build with miniprogram config
    V-->>BM: Return build completion
    BM->>FS: Write package.json to "dist/miniprogram"

Loading

sequenceDiagram
    participant U as User
    participant RR as readBarcodes Function
    U->>RR: Call readBarcodes(input)
    alt Input is ArrayBuffer/Uint8Array
        RR->>RR: Process as binary data
    else Input is Blob
        RR->>RR: Convert Blob to ArrayBuffer
    else Input is ImageData
        RR->>RR: Process ImageData
    else
        RR->>U: Throw TypeError (invalid input)
    end
    RR-->>U: Return barcode result

Loading

Possibly related PRs

• Version Packages #193: Updates to the readBarcodes function's parameter types directly relate to this PR's modifications.
• Version Packages (beta) #185: Consolidates multiple reader functions into a single readBarcodes(...) function and enhances input support.
• feat: add reader support for DataBarLimited #159: Involves a minor version update for the package and introduces new barcode format support, echoing aspects of this PR.

Poem

In the code garden, I hop with glee,
Adding types for buffers and arrays, you see.
Miniprogram builds now dance in the light,
With a tidy cleanup before build takes flight.
A rabbit’s cheer in every commit and line,
Celebrating changes, whimsical and fine!
🐇✨

✨ Finishing Touches

• 📝 Generate Docstrings (Beta)

---

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>, please review it.
  • Generate unit testing code for this file.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
  • @coderabbitai generate unit testing code for this file.
  • @coderabbitai modularize this function.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
  • @coderabbitai read src/utils.ts and generate unit testing code.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
  • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

• @coderabbitai pause to pause the reviews on a PR.
• @coderabbitai resume to resume the paused reviews.
• @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
• @coderabbitai full review to do a full review from scratch and review all the files again.
• @coderabbitai summary to regenerate the summary of the PR.
• @coderabbitai generate docstrings to generate docstrings for this PR. (Beta)
• @coderabbitai resolve resolve all the CodeRabbit review comments.
• @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
• @coderabbitai help to get help.

Other keywords and placeholders

• Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
• Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
• Add @coderabbitai anywhere in the PR title to generate the title automatically.

Documentation and Community

• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.

[pkg-pr-new]

Open in Stackblitz

npm i https://pkg.pr.new/zxing-wasm@107

commit: 7972b83

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (4)

src/share.ts (2)

312-351: Refine input type checks for typed arrays.

Currently, the code checks "buffer" in input to identify Uint8Array, but it may accept other typed arrays unintentionally (e.g., Float32Array). Restricting the logic to actual Uint8Array or using an instanceof check ensures clarity for consumers and consistent behavior for the WASM module.

---

405-447: Polyfill remains incomplete.

The minimal Blob polyfill may be sufficient for basic use; however, it lacks support for slicing, streaming, and text reading. If advanced blob capabilities are needed, consider replacing this stub or surfacing a clear error message. I'm happy to help implement a more complete polyfill if needed.

.changeset/pink-tips-unite.md (1)

1-6: Consider enhancing the changeset message.

While the message captures the main feature, it could be more descriptive about the input type changes.

---
"zxing-wasm": minor
---

-Support WeChat Mini Program.
+Support WeChat Mini Program and expand readBarcodes input types (ArrayBuffer, Uint8Array).

README.md (1)

339-362: Addition of WeChat Mini Program Usage Notes
The new section detailing usage in WeChat mini programs is very useful. However, please consider the following improvements:

• Accessibility Improvement: The inline image on line 340 (used as an icon) should include an alt attribute to satisfy accessibility standards and markdownlint (MD045). For example, update:

  -<img src="https://github.com/user-attachments/assets/7d8f3337-dd9c-43ec-aab4-8d4e72d32867" width="16" height="16">
  +<img src="https://github.com/user-attachments/assets/7d8f3337-dd9c-43ec-aab4-8d4e72d32867" width="16" height="16" alt="Mini Program Icon">

• Formatting Detail: There appears to be a blank line within a blockquote (as flagged by markdownlint MD028, possibly around line 341). Consider removing any extraneous blank lines inside the blockquote to ensure consistent formatting.

These are minor nitpicks to improve readability and maintain compliance with style guidelines.

🧰 Tools

🪛 markdownlint-cli2 (0.17.2)

340-340: Images should have alternate text (alt text)
null

(MD045, no-alt-text)

---

362-362: Blank line inside blockquote
null

(MD028, no-blanks-blockquote)

📜 Review details

Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between ba1cac2 and 7972b83.

⛔ Files ignored due to path filters (2)

• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
• tests/samples/qrcode/wikipedia.png is excluded by !**/*.png

📒 Files selected for processing (10)

• .changeset/pink-tips-unite.md (1 hunks)
• .changeset/pretty-ravens-send.md (1 hunks)
• README.md (2 hunks)
• package.json (3 hunks)
• scripts/build-cjs.ts (1 hunks)
• scripts/build-miniprogram.ts (1 hunks)
• src/full/index.ts (1 hunks)
• src/reader/index.ts (1 hunks)
• src/share.ts (6 hunks)
• tests/unit.test.ts (2 hunks)

🧰 Additional context used

🪛 markdownlint-cli2 (0.17.2)

README.md

340-340: Images should have alternate text (alt text)
null

(MD045, no-alt-text)

---

362-362: Blank line inside blockquote
null

(MD028, no-blanks-blockquote)

⏰ Context from checks skipped due to timeout of 90000ms (3)

• GitHub Check: preview-release
• GitHub Check: test
• GitHub Check: preview-release

🔇 Additional comments (13)

src/share.ts (3)

86-130: Consider verifying environment detection and behavior for non-Vite setups.

You're relying on import.meta.env.MODE and import.meta.env.PROD to detect the runtime environment, throwing an error for Mini Program users. While this is valid in many Vite-based projects, ensure it's clearly documented that a build system supplying these variables is mandatory. Otherwise, fallback logic or environment checks outside of Vite might be needed to provide a smooth developer experience.

---

290-290: Good documentation update.

Expanding the docstring to reference all supported input types simplifies onboarding for new developers.

---

300-300: Expanded parameter types look correct.

Allowing Blob | ArrayBuffer | Uint8Array | ImageData in the signature aligns with the doc comment and broadens input compatibility.

scripts/build-cjs.ts (1)

2-7: Pre-build cleanup is a solid step.

Using rimraf to remove the old dist/cjs directory helps prevent conflicts with stale artifacts. This is a best practice to ensure a clean build output.

scripts/build-miniprogram.ts (1)

1-42: New miniprogram build step looks good.

Defining a dedicated build process with a distinct mode: "miniprogram" and output directory provides clarity and maintainability. Note that outputting CommonJS may remain necessary for now, but consider verifying future compatibility in case the WeChat environment evolves to support ESM natively.

src/reader/index.ts (1)

75-80: LGTM! Input type expansion enhances compatibility.

The expansion of input types to include ArrayBuffer and Uint8Array improves compatibility with various environments, particularly WeChat Mini Program, while maintaining backward compatibility.

src/full/index.ts (1)

76-81: LGTM! Consistent type expansion across modules.

The input type expansion matches the changes in reader/index.ts, maintaining API consistency between the full and reader modules.

tests/unit.test.ts (1)

189-246: LGTM! Comprehensive test coverage for all input types.

Excellent test suite that:

• Covers all supported input types (ArrayBuffer, Blob, File, Uint8Array, ImageData)
• Uses real QR code data
• Verifies both result presence and content accuracy

.changeset/pretty-ravens-send.md (1)

1-6: Changeset Format Looks Good
The changeset correctly describes the update ("Accept ArrayBuffer and Uint8Array as input types in readBarcodes") and uses the expected format.

package.json (3)

12-12: New Miniprogram Export Entry Added
The new "miniprogram": "./dist/miniprogram" export entry is properly added. This aligns with introducing a dedicated build for WeChat mini programs.

---

175-176: Integration of Miniprogram Build Process
The addition of the "build:miniprogram": "tsx ./scripts/build-miniprogram.ts" script and its integration into the overall "build" command ensures the miniprogram output is built alongside other modules. Please verify that the referenced script (scripts/build-miniprogram.ts) exists and works as expected.

---

194-194: New Dev Dependency Added
The new dev dependency "@napi-rs/canvas": "^0.1.67" appears to support additional miniprogram or graphics-related functionality. Ensure that it is compatible with your project and that its inclusion is well documented in any relevant project documentation.

README.md (1)

133-133: Updated Documentation for readBarcodes Input Types
The documentation now reflects that readBarcodes accepts ArrayBuffer and Uint8Array along with other types. This is clear and informative for users.