Add getElementsByClassName function to legacy.ts (#1551)

Co-authored-by: Felix <[email protected]>

src/__fixtures__/fixture.ts

@@ -1,7 +1,7 @@
 import { parseDocument } from "htmlparser2";
 
 const markup = Array(21).join(
-    "<?xml><tag1 id='asdf'> <script>text</script> <!-- comment --> <tag2> text </tag1>",
+    "<?xml><tag1 id='asdf' class='class1'> <script>text</script> <!-- comment --> <tag2> text </tag1>",
 );
 
 export default parseDocument(markup).children;

src/legacy.spec.ts

@@ -3,6 +3,7 @@ import { ElementType } from "domelementtype";
 import {
     getElements,
     getElementById,
+    getElementsByClassName,
     getElementsByTagName,
     getElementsByTagType,
 } from "./legacy";
@@ -95,6 +96,17 @@ describe("legacy", () => {
             expect(getElementById("asdfs", fixture, true)).toBeNull());
     });
 
+    describe("getElementsByClassName", () => {
+        it("returns the specified nodes", () =>
+            expect(
+                getElementsByClassName("class1", fixture, true),
+            ).toHaveLength(20));
+        it("returns empty array for unknown class names", () =>
+            expect(
+                getElementsByClassName("class23", fixture, true),
+            ).toHaveLength(0));
+    });
+
     describe("getElementsByTagName", () => {
         it("returns the specified nodes", () =>
             expect(getElementsByTagName("tag2", fixture, true)).toEqual(

src/legacy.ts

@@ -176,6 +176,30 @@ export function getElementsByTagName(
     ) as Element[];
 }
 
+/**
+ * Returns all nodes with the supplied `className`.
+ *
+ * @category Legacy Query Functions
+ * @param className Class name to search for.
+ * @param nodes Nodes to search through.
+ * @param recurse Also consider child nodes.
+ * @param limit Maximum number of nodes to return.
+ * @returns All nodes with the supplied `className`.
+ */
+export function getElementsByClassName(
+    className: string | ((name: string) => boolean),
+    nodes: AnyNode | AnyNode[],
+    recurse = true,
+    limit: number = Infinity,
+): Element[] {
+    return filter(
+        getAttribCheck("class", className),
+        nodes,
+        recurse,
+        limit,
+    ) as Element[];
+}
+
 /**
  * Returns all nodes with the supplied `type`.
  *

src/stringify.spec.ts

@@ -11,7 +11,7 @@ describe("stringify", () => {
     describe("getOuterHTML", () => {
         it("Correctly renders the outer HTML", () => {
             expect(getOuterHTML(fixture[1])).toBe(
-                '<tag1 id="asdf"> <script>text</script> <!-- comment --> <tag2> text </tag2></tag1>',
+                '<tag1 id="asdf" class="class1"> <script>text</script> <!-- comment --> <tag2> text </tag2></tag1>',
             );
         });
     });