docs: update readme

Author: mato533

.github/dependabot.yml

@@ -0,0 +1,39 @@
+version: 2
+updates:
+    - package-ecosystem: npm
+      directory: '/'
+      schedule:
+          interval: weekly
+          time: '11:00'
+      open-pull-requests-limit: 10
+      versioning-strategy: increase-if-necessary
+      ignore:
+          # updates to Node.js requires update to .nvmrc
+          - dependency-name: '@types/node'
+            update-types: ['version-update:semver-major']
+      groups:
+          patch-deps-updates-main:
+              update-types:
+                  - 'patch'
+          minor-deps-updates-main:
+              update-types:
+                  - 'minor'
+          major-deps-updates-main:
+              update-types:
+                  - 'major'
+    - package-ecosystem: github-actions
+      directory: '/'
+      schedule:
+          interval: weekly
+          time: '11:00'
+      open-pull-requests-limit: 10
+      groups:
+          patch-deps-updates:
+              update-types:
+                  - 'patch'
+          minor-deps-updates:
+              update-types:
+                  - 'minor'
+          major-deps-updates:
+              update-types:
+                  - 'major'

README.md

@@ -1,47 +1,67 @@
 <h1 align="center">WebdriverIO extension for Visual Studio Code.</h1>
 
+<p align="center">
+  <a title="WebdriverIO extension for Visual Studio Code" href="https://github.com/webdriverio/vscode-webdriverio"><img src="./assets/vscode-webdriverio.png" alt="WebdriverIO extension for Visual Studio Code" width="50%" /></a>
+</p>
+
 ## Features
 
-- **Run**, WebdriverIO tests in Visual Studio Code.
+- **Run** WebdriverIO tests in Visual Studio Code.
+- **All of the frameworks supported by WebdriverIO** can be used with this extension.
 
 ## Requirements
 
 - Visual Studio Code version >= 1.98.0
 - WebdriverIO version >= v9.0.0
 - Node.js version >= 18.0.0 (follows WebdriverIO)
 
-## 🚧🚧　Extension Settings 🚧🚧
+## Usage
 
-Include if your extension adds any VS Code settings through the `contributes.configuration` extension point.
+You can manage tests both from the Testing view.
 
-For example:
+The WebdriverIO uses vscode's `TestController' APIs to provide a unified testing experience.<br>
+You can read the official guides about how to run the tests in the VSCode Documentation.
 
-This extension contributes the following settings:
+### Testing view
+
+![Testing view](./assets/testing-view.png 'Testing view')
 
-- `myExtension.enable`: Enable/disable this extension.
-- `myExtension.thing`: Set to `blah` to do something.
+The toolbar at the top provides various commands to manage test execution:
 
-## 🚧🚧　Known Issues　🚧🚧
+- **Refresh Tests**: To reload your test suite, reflecting any new changes.
+- **Run All Tests**: To start testing all cases that are currently visible.
+- **Show Output**: To display detailed logs from test executions.
+- **Miscellaneous Settings**: To customize the Testing view, such as sorting and grouping tests.
 
-Calling out known issues can help limit users opening duplicate issues against your extension.
+Icons next to each test indicate their status
 
----
+- passed (checkmark)
+- failed (cross)
+- skipped (arrow)
+- running or loading (spinner)
+- not executed (dot)
 
-## 🚧🚧　Following extension guidelines　🚧🚧
+### Test File
 
-Ensure that you've read through the extensions guidelines and follow the best practices for creating your extension.
+![Test File](./assets/testing-file.png 'Test File')
 
-- [Extension Guidelines](https://code.visualstudio.com/api/references/extension-guidelines)
+When you open a test file, you could notice test icons in the gutter next to each test case.
 
-## 🚧🚧　Working with Markdown　🚧🚧
+You can do the following actions:
 
-You can author your README using Visual Studio Code. Here are some useful editor keyboard shortcuts:
+- **Run a Single Test:** Click the test icon next to a test case to run that specific test.
+- **More Options:** Right-click the test icon to open a context menu with additional options:
+    - `Run Test`: Execute the selected test case.
+    - `Reveal in Test Explorer`: Locate and highlight the test in the centralized Testing view.
 
-- Split the editor (`Cmd+\` on macOS or `Ctrl+\` on Windows and Linux).
-- Toggle preview (`Shift+Cmd+V` on macOS or `Shift+Ctrl+V` on Windows and Linux).
-- Press `Ctrl+Space` (Windows, Linux, macOS) to see a list of Markdown snippets.
+## 　Extension Settings
 
-## 🚧🚧　For more information　🚧🚧
+Include if your extension adds any VS Code settings through the `contributes.configuration` extension point.
+
+For example:
+
+This extension contributes the following settings:
 
-- [Visual Studio Code's Markdown Support](http://code.visualstudio.com/docs/languages/markdown)
-- [Markdown Syntax Reference](https://help.github.com/articles/markdown-basics/)
+- `webdriverio.configFilePattern`: Glob pattern for WebdriverIO configuration file
+- `webdriverio.logLevel`: Set the logLevel
+- `webdriverio.showOutput`: Show WebdriverIO output in the test result when set `true` this option