test(wpcarro/slx): Add (basic) tests r/5717

Tests with React? ...wat?

Change-Id: I95ccd08bb6e66e9d74a63a596b5f844f9dab0361
Reviewed-on: https://cl.tvl.fyi/c/depot/+/7884
Reviewed-by: wpcarro <wpcarro@gmail.com>
Autosubmit: wpcarro <wpcarro@gmail.com>
Tested-by: BuildkiteCI

1 files changed, 64 insertions, 0 deletions

diff --git a/users/wpcarro/slx.js/tests.js b/users/wpcarro/slx.js/tests.js
new file mode 100644
index 000000000000..5e8b53d86de2
--- /dev/null
+++ b/users/wpcarro/slx.js/tests.js
@@ -0,0 +1,64 @@
+import { createRoot } from "react-dom/client";
+import React from "react";
+
+
+const john = { first: 'John', last: 'Cleese', age: 83, birthday: new Date("10/27/1939") };
+const graham = { first: 'Graham', last: 'Chapman', age: 48, birthday: new Date("01/08/1941") };
+
+const xs = [
+    john,
+    graham,
+];
+const cfg = {
+    caseSensitive: false,
+    preferRegex: true,
+    dateKey: 'birthday',
+};
+const tests = [
+    ['support numeric comparisons', 'age=83', xs, cfg, [john]],
+    ['supports grouping (1)', 'last:/^C/ (age=83 OR age=48)', xs, cfg, [john, graham]],
+    ['supports grouping (2)', '(age=83)', xs, cfg, [john]],
+    ['supports grouping (3)', '(age=83 OR age=48)', xs, cfg, [john, graham]],
+];
+
+function equal(xs, ys) {
+    return xs.length === ys.length && xs.every((x, i) => x === ys[i]);
+}
+
+class App extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        return (
+            <table>
+              <thead>
+                <th>pass/fail</th>
+                <th>Label</th>
+                <th>code</th>
+                <th>actual</th>
+                <th>expected</th>
+              </thead>
+              <tbody>
+                {this.props.tests.map(test => {
+                    const [label, query, xs, cfg, expected] = test;
+                    const actual = select(query, xs, cfg);
+                    return (
+                        <tr>
+                          <td>{equal(actual, expected) ? "pass" : "fail"}</td>
+                          <td>{label}</td>
+                          <td>select("{query}", {JSON.stringify(xs)}, {JSON.stringify(cfg)})</td>
+                          <td>{JSON.stringify(actual)}</td>
+                          <td>{JSON.stringify(expected)}</td>
+                        </tr>
+                    );
+                })}
+              </tbody>
+            </table>
+        );
+    }
+}
+
+const container = document.getElementById("mount");
+const root = createRoot(container);
+root.render(<App tests={tests} />);