Added FAQ section to the capture vision docs

programming/javascript/faq/app-switching-issue.md

@@ -0,0 +1,33 @@
+---
+layout: default-layout
+title: How can I prevent my browser from freezing or showing a grey screen when I switch between apps and return to it?
+keywords: Dynamsoft Barcode Reader, FAQ, tech basic, frozen screen, grey screen
+description: How can I prevent my browser from freezing or showing a grey screen when I switch between apps and return to it?
+needAutoGenerateSidebar: false
+---
+
+# How can I prevent my browser from freezing or showing a grey screen when I switch between apps and return to it?
+
+[<< Back to FAQ index](index.md)
+
+When using the camerenhancer sdk, you may encounter an issue where switching to another app and then returning to the browser results in a frozen or grey screen. To address this, utilize a workaround in the form of the following code snippet:
+
+```javascript
+window.addEventListener("visibilitychange", () => {
+    if (document.visibilityState === "hidden") {
+        if (router && cameraEnhancer) {
+            router.stopCapturing().then(() => {
+                cameraEnhancer.close();
+            });
+        }
+    } else if (document.visibilityState === "visible") {
+        if (router && cameraEnhancer) {
+            cameraEnhancer.open().then(status => {
+                router.startCapturing("DetectDocumentBoundaries_Default");
+            });
+        }
+    }
+});
+```
+
+This code essentially closes the camera and releases associated resources when the user exits the browser. It then reopens the camera when the user returns to the browser, ensuring a smoother experience.

programming/javascript/faq/index.md

@@ -0,0 +1,15 @@
+---
+layout: default-layout
+title: JavaScript - Dynamsoft Capture Vision FAQ
+keywords: faq, javascript, dcv
+description: Dynamsoft Capture Vision FAQ - JavaScript
+needAutoGenerateSidebar: false
+permalink: /faq/index.html
+
+---
+
+# FAQ - JavaScript
+
+1. [How can I prevent my browser from freezing or showing a grey screen when I switch between apps and return to it?](app-switching-issue.html)
+
+2. [Why am I encountering errors like "r.taskSet.intermediateResultUnits is not iterable" when using frameworks like React or Angular with Dynamsoft packages?](version-mismatch.html)

programming/javascript/faq/version-mismatch.md

@@ -0,0 +1,47 @@
+---
+layout: default-layout
+title: Why am I encountering errors like "r.taskSet.intermediateResultUnits is not iterable" when using frameworks like React or Angular with Dynamsoft packages?
+keywords: Dynamsoft Capture Vision, FAQ, version, mismatch, taskset
+description: Why am I encountering errors like "r.taskSet.intermediateResultUnits is not iterable" when using frameworks like React or Angular with Dynamsoft packages?
+needAutoGenerateSidebar: false
+---
+
+# Why am I encountering errors like "r.taskSet.intermediateResultUnits is not iterable" when using frameworks like React or Angular with Dynamsoft packages?
+
+[<< Back to FAQ index](index.md)
+
+Topic: Resolving Version Mismatch Issues in Dynamsoft Packages
+
+Resolution:
+
+When using a framework like React or Angular with Dynamsoft packages, it's crucial to ensure that the version number of each Dynamsoft package listed in the `package.json` file matches the version number defined in the `engineResourcePaths` generally found defined in the cvr.ts file if you have followed the samples for developement.
+
+In the `engineResourcePaths` configuration, make sure to include the correct version numbers for each Dynamsoft package mentioned in `package.json`. Here's an example of how to define the engineResourcePaths with the correct version numbers:
+
+```javascript
+Dynamsoft.Core.CoreModule.engineResourcePaths = {
+  std: "https://cdn.jsdelivr.net/npm/dynamsoft-capture-vision-std@<std_version>/dist/",
+  dip: "https://cdn.jsdelivr.net/npm/dynamsoft-image-processing@<dip_version>/dist/",
+  core: "https://cdn.jsdelivr.net/npm/dynamsoft-core@<core_version>/dist/",
+  license: "https://cdn.jsdelivr.net/npm/dynamsoft-license@<license_version>/dist/",
+  cvr: "https://cdn.jsdelivr.net/npm/dynamsoft-capture-vision-router@<cvr_version>/dist/",
+  dbr: "https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader@<dbr_version>/dist/",
+  dce: "https://cdn.jsdelivr.net/npm/dynamsoft-camera-enhancer@<dce_version>/dist/"
+};
+```
+Replace <std_version>, <dip_version>, <core_version>, <license_version>, <cvr_version>, <dbr_version>, and <dce_version> with the appropriate version numbers corresponding to each Dynamsoft package.
+
+```javascript
+//some lines from package.json
+"dependencies": {
+...
+  "dynamsoft-barcode-reader": "<dbr_version>",
+  "dynamsoft-camera-enhancer": "<dce_version>",
+  "dynamsoft-capture-vision-router": "<cvr_version>",
+  "dynamsoft-core": "<core_version>",
+  "dynamsoft-license": "<license_version>",
+  "dynamsoft-utility": "<utility_version>",
+}
+```
+
+By following these steps and maintaining consistency in version numbers between `package.json` and `engineResourcePaths`, you can mitigate version mismatch errors and ensure the proper functioning of Dynamsoft packages within your framework-based application.