pw_web: Add manual testing page in docs
Bug: 288587657
Change-Id: Idb303e2c9b138474777441c0e54bc2044b1076d4
Reviewed-on: https://pigweed-review.googlesource.com/c/pigweed/pigweed/+/178923
Reviewed-by: Keir Mierle <keir@google.com>
Commit-Queue: Amy Hu <amyhu@google.com>
Reviewed-by: Asad Memon <asadmemon@google.com>
Presubmit-Verified: CQ Bot Account <pigweed-scoped@luci-project-accounts.iam.gserviceaccount.com>
diff --git a/pw_web/BUILD.gn b/pw_web/BUILD.gn
index a4d5ebe..5069f94 100644
--- a/pw_web/BUILD.gn
+++ b/pw_web/BUILD.gn
@@ -18,7 +18,10 @@
import("$dir_pw_unit_test/test.gni")
pw_doc_group("docs") {
- sources = [ "docs.rst" ]
+ sources = [
+ "docs.rst",
+ "testing.rst",
+ ]
}
pw_test_group("tests") {
diff --git a/pw_web/docs.rst b/pw_web/docs.rst
index 95914a0..d90c22a 100644
--- a/pw_web/docs.rst
+++ b/pw_web/docs.rst
@@ -3,7 +3,6 @@
---------
pw_web
---------
-
Pigweed provides an NPM package with modules to build web apps for Pigweed
devices.
@@ -29,7 +28,6 @@
Import Directly in HTML
^^^^^^^^^^^^^^^^^^^^^^^
-
If you don't want to set up a bundler, you can also load Pigweed directly in
your HTML page by:
@@ -149,7 +147,6 @@
WebSerialTransport
------------------
-
To help with connecting to WebSerial and listening for serial data, a helper
class is also included under ``WebSerial.WebSerialTransport``. Here is an
example usage:
@@ -192,7 +189,6 @@
Web Console
===========
-
Pigweed includes a web console that demonstrates `pigweedjs` usage in a
React-based web app. Web console includes a log viewer and a REPL that supports
autocomplete. Here's how to run the web console locally:
@@ -205,7 +201,6 @@
Log viewer component
====================
-
The NPM package also includes a log viewer component that can be embedded in any
webapp. The component works with Pigweed's RPC stack out-of-the-box but also
supports defining your own log source.
@@ -260,7 +255,6 @@
Custom Log Source
-----------------
-
You can define a custom log source that works with the log viewer component by
just extending the abstract `LogSource` class and emitting the `logEntry` events
like this:
@@ -298,7 +292,6 @@
Color Scheme
------------
-
The log viewer web component provides the ability to set the color scheme manually, overriding any default or system preferences.
To set the color scheme, first obtain a reference to the ``log-viewer`` element in the DOM. A common way to do this is by using ``querySelector()``:
@@ -318,3 +311,11 @@
logViewer.setAttribute('colorscheme', 'dark');
The color scheme can be set to ``'dark'``, ``'light'``, or the default ``'auto'`` which allows the component to adapt to the preferences in the operating system settings.
+
+Guides
+======
+
+.. toctree::
+ :maxdepth: 1
+
+ testing
diff --git a/pw_web/testing.rst b/pw_web/testing.rst
new file mode 100644
index 0000000..d8f0ed9
--- /dev/null
+++ b/pw_web/testing.rst
@@ -0,0 +1,46 @@
+.. _module-pw_web-testing:
+
+=====================
+Manual Test Procedure
+=====================
+``pw_web`` is a web based log viewer and the manual tests here are intended
+to address situations where automated tests are not able to cover.
+
+Test Sections
+=============
+
+Log View
+^^^^^^^^
+
+.. list-table::
+ :widths: 5 45 45 5
+ :header-rows: 1
+
+ * - #
+ - Test Action
+ - Expected Result
+ - ✅
+
+ * - 1
+ -
+ -
+ - |checkbox|
+
+ * - 2
+ -
+ - |
+ |
+ - |checkbox|
+
+Add note to the commit message
+==============================
+Add a ``Testing:`` line to your commit message and mention the steps
+executed. For example:
+
+.. code-block:: text
+
+ Testing: Log Pane Steps 1-6
+
+.. |checkbox| raw:: html
+
+ <input type="checkbox">