add vs's web unit test & coverage tools

docs/application/toc_vs-ext_native.md

@@ -50,7 +50,7 @@
 ###### [Emulator Control Panel](/application/vstools/tools/emulator-control-panel.md)
 ##### [Tool : Device Manager](/application/vstools/tools/device-manager.md)
 ##### [Tool : SDB](/application/tizen-studio/common-tools/smart-development-bridge.md)
-##### [Native Unit Test](/application/vstools/getting-started/test-profile-app-unit-test-code-coverage.md)
+##### [Native Unit Test](/application/vstools/getting-started/native-app-unit-test.md)
 
 #### CLI
 ##### [Tizen CLI](/application/tizen-studio/common-tools/command-line-interface.md)

docs/application/toc_vs-ext_web.md

@@ -48,6 +48,7 @@
 ##### [Tool : Device Manager](/application/vstools/tools/device-manager.md)
 ##### [Tool : SDB](/application/tizen-studio/common-tools/smart-development-bridge.md)
 ##### [Tool : TV Web Simulator](/application/tizen-studio/common-tools/smart-development-bridge.md)
+##### [Web Unit Test](/application/vstools/getting-started/web-app-unit-test.md)
 
 #### CLI
 ##### [Tizen CLI](/application/tizen-studio/common-tools/command-line-interface.md)

docs/application/vstools/getting-started/native-app-unit-test.md

@@ -0,0 +1,131 @@
+# Tizen Native Application Unit Test with Code Coverage
+
+**Code Coverage** is a profiling tool used to measure how much of your application's source code is executed while running unit tests. It helps evaluate **code quality** and identify untested parts of your codebase.  
+
+A higher coverage percentage indicates that most of your source code has been tested, which reduces the likelihood of undetected software bugs. By using **Unit Tests**, you can verify the correctness of your code, improve reliability, and maintain high software quality.
+
+The **Tizen Studio Extension for Visual Studio** provides tools for:
+- Creating, building, and editing unit tests  
+- Running and analyzing test results  
+- Measuring and visualizing code coverage  
+
+For **Native Applications**, the Code Coverage feature in the **Tizen Extension for Visual Studio** is powered by the **`llvm-cov`** tool.  
+It helps you:
+- Detect code segments that are not covered by unit tests  
+- Ensure that uncovered code does not cause runtime issues  
+- Measure different types of coverage:
+  - **Functional coverage**
+  - **Statement coverage**
+  - **Branch coverage**
+
+The extension uses the **Google Test (gtest)** framework to create and execute test cases.
+
+> [NOTE]
+>
+> Before you run the Unit Test and Code Coverage, make sure:
+  > - You have an Emulator or a connected target device running.
+  > - If you want to try out the tool and do not have an applicable project to test, create a project with the **Project Wizard** using a template or a sample. For more information on creating a project, check [Native Application Development](../Tizen/native.md).
+
+
+## To create a Unit Test project
+  You can create a test project for **Tizen Native Project** through the **Tizen Native Unit Test Project Wizard**. The wizard provides the test project for each Tizen Native project type, such as UI application, service application, shared library, and static library.
+
+  To create a test project, follow these steps:
+  1. In the Visual Studio Solution Explorer, right-click on the solution name, select **Add > New Project > Tizen Native Project**, and click on **Next** button. As illustrated in the following figure:
+
+      <img src="./media/utc_1.png" alt="Creating gtest project part: 1" width="980"/>
+
+      <!-- ![Test results](./media/utc_1.png) -->
+
+      <img src="./media/utc_2.png" alt="Creating gtest project part: 2" width="980"/>
+
+      <!-- ![Test results](./media/utc_2.png) -->
+
+  2. In the **Configure your new project** window, select a name for the **Unit Test** project > click on **create** button > select **gtest** template > press **OK** as illustrated in the following figure:
+
+      <img src="./media/utc_3.png" alt="Creating gtest project part: 3" width="980"/>
+
+      <!-- ![Test results](./media/utc_3.png) -->
+
+## To configure the Unit Test project for Native App
+1. Right-click on the **Unit Test** project > select **Add Tizen Project Dependency** > Select the **Native App** > press **OK** as illustrated in the following figure:
+
+    <img src="./media/utc_4.png" alt="Add tizen dependency" width="480"/>
+
+    <!-- ![Test results](./media/utc_4.png) -->
+
+2. Again right-click on the **Unit Test** project > select **Set as Startup Project**
+
+3. To use the test project, follow these steps:
+
+    * `<TEST_PROJECT_HOME>/<TEST_PROJECT_NAME>/src/<TEST_PROJECT_NAME>_test.cpp` file.
+
+    * Add a `TEST_F()` test case.
+
+      Each `TEST_F()` test case is independent. If the `TEST_F()` test case is associated with a fixture class name, the test case runs based on that fixture class.
+
+    * Add assertions:
+
+        <img src="./media/utc_5.png" alt="Adding assertion" width="980"/>
+
+        <!-- ![Test results](./media/utc_5.png) -->
+
+      The Unit Test tool supports basic assertions, binary comparison, and string comparison in the **gtest**. For more information, check [Google Test Advanced Guide](https://github.com/google/googletest/blob/main/docs/advanced.md).
+
+    * Call a method of the main Native project in the test case:
+
+        <img src="./media/utc_9.png" alt="Calling ADD method" width="480"/>
+
+        <!-- ![Test results](./media/utc_9.png) -->
+
+      The header of the Native App should be included in the Unit Test project cpp file (in this example: the `ADD()` method is described in `tizennative3.c`, so the header `tizennative3.h` is included). As illustrated in the following figure:
+
+      In case if the Native project is written in C code, use extern to include the header (To know more details about extern, visit [extern (C++)](https://learn.microsoft.com/en-us/cpp/cpp/extern-cpp?view=msvc-170)). 
+
+        <img src="./media/utc_10.png" alt="adding extern for c" width="480"/>
+
+        <!-- ![Test results](./media/utc_10.png) -->
+
+      The method declaration should be mentioned in the header file.
+
+        <img src="./media/utc_8.png" alt="method mention in header file" width="480"/>
+
+        <!-- ![Test results](./media/utc_8.png) -->
+
+    * Enclose the main() function of the Native project with `TEST_BUILD`:
+      ```csharp
+      #ifndef TEST_BUILD
+      //main method
+      #endif
+      ```
+
+        <img src="./media/utc_11.png" alt="enclosing main method with macros" width="980"/>
+
+        <!-- ![Test results](./media/utc_12.png) -->
+
+## To run the Unit Test project on devices
+
+To launch the Unit Test project, click the **Run(ctrl + f5)** icon in the toolbar.
+
+After the test cases are executed, the results are displayed on the **Native Unit Test Result** in **Explorer View** and the **Code Coverage** information is displayed in the default browser in the form of HTML.
+
+ * ### Explorer view
+    * Upon double click on the failed test case, the cursor will navigate to the line the test case failed. As illustrated in the following figure:
+
+      <img src="./media/utc_12.png" alt="Unit test result report" width="980"/>
+
+      <!-- ![Test results](./media/utc_12.png) -->
+
+ * ### HTML Code Coverage report
+    * The **index.html** page is opened in the browser to view the Code Coverage Report, as illustrated in the following figure:
+
+      <img src="./media/coverage_report_1.PNG" alt="HTML Code Coverage Report" width="880"/>
+
+      <!-- ![Test results](./media/coverage_report_1.png) -->
+
+    * Click on any of the projects to get the coverage at the file level, as illustrated in the following figure:
+
+      <img src="./media/coverage_report_2.PNG" alt="HTML Code Coverage Report navigation" width="880"/>
+
+      <!-- ![Test results](./media/coverage_report_2.png) -->
+

docs/application/vstools/getting-started/web-app-unit-test.md

@@ -0,0 +1,52 @@
+# Tizen Web Application Unit Test with Code Coverage
+
+**Code Coverage** is a profiling tool used to measure how much of your application's source code is executed while running unit tests. It helps evaluate **code quality** and identify untested parts of your codebase.  
+
+A higher coverage percentage indicates that most of your source code has been tested, which reduces the likelihood of undetected software bugs. By using **Unit Tests**, you can verify the correctness of your code, improve reliability, and maintain high software quality.
+
+The **Tizen Studio Extension for Visual Studio** provides tools for:
+- Creating, building, and editing unit tests  
+- Running and analyzing test results  
+- Measuring and visualizing code coverage  
+
+For **Web Applications**, you can also create and run unit tests within the **Tizen Extension for Visual Studio**.  
+These tools allow you to:
+- Write test cases for web projects  
+- Execute them on an emulator or target device  
+- View and analyze test results directly in Visual Studio
+
+> [NOTE]
+>
+> Before you run the Unit Test and Code Coverage, make sure:
+> - You have an Emulator or a connected target device running.
+> - If you don’t have a web application project to test, you can create one using the **Project Wizard** with a template or sample project. For more details, see [Web Application Development](../Tizen/web.md).
+
+
+##  Configuring a Web App for Web Test
+
+###  Step 1: Create a Tizen Web Unit Test
+1. In **Visual Studio**, right-click on your **Web project name**.     
+2. Select **Create Tizen Web Unit Test**.  
+![Create Web Unit Test](../media/create_web_unit_test.png)
+3. Choose the **.js** file where your test cases are written.  
+4. Select the test cases you want to include.  
+5. *(Optional)* Choose **Create Setup** or **Create Teardown** if needed.  
+6. Enter a name for the test file and click **OK**.
+![Web Unit Test Dialog](../media/web_unit_test_dialog.png)
+---
+
+### Step 2: Modify the Generated Test File
+- A folder named **`webunittest`** will be created in your project.  
+- Inside this folder, a file named **`tests/mainTests.js`** (or your chosen test file name) will be automatically generated.  
+- Modify this file to define or customize your test cases as needed.
+
+![Run Web Unit Test](../media/run_web_unit_test.png)
+---
+
+### Step 3: Run the Tizen Web Unit Test
+1. Right-click again on your **Web project name**.  
+2. Select **Run Tizen Web Unit Test**.  
+3. The test will execute on your selected emulator or connected device.  
+4. Once complete, the test results will be displayed in the output window in a tree format. It shows the passed tests with a green icon and failed tests with a red icon. Upon double click after opening the dropdown of the failed testcase, the cursor will navigate to the line of the failed testcase.
+
+![Web Unit Test Result](../media/web_unit_test_result.png)