@bigbinary/neeto-playwright-commons 1.8.47 → 1.9.0

package/configs/scripts/jsdoc-builder/constants.mjs

@@ -0,0 +1,41 @@
+import { complement, startsWith } from "ramda";
+
+export const REMARK_NODE_TYPES = {
+  HTML: "html",
+  PARAGRAPH: "paragraph",
+  CODE: "code",
+  HEADING: "heading",
+  TEXT: "text",
+  INLINE_CODE: "inlineCode",
+};
+
+export const BABEL_NODE_TYPES = { IDENTIFIER: "Identifier" };
+
+export const SUBHEADING_PATTERN = { type: REMARK_NODE_TYPES.HEADING, depth: 2 };
+export const HTML_PATTERN = { type: REMARK_NODE_TYPES.HTML };
+export const IMG_PATTERN = {
+  type: REMARK_NODE_TYPES.HTML,
+  value: startsWith("<img"),
+};
+export const CODE_PATTERN = { type: REMARK_NODE_TYPES.CODE };
+export const PARAGRAPH_PATTERN = { type: REMARK_NODE_TYPES.PARAGRAPH };
+export const HTML_EXCEPT_IMG_PATTERN = {
+  type: REMARK_NODE_TYPES.HTML,
+  value: complement(startsWith("<img")),
+};
+export const INLINE_CODE_PATTERN = { type: REMARK_NODE_TYPES.INLINE_CODE };
+export const TEXT_PATTERN = { type: REMARK_NODE_TYPES.TEXT };
+export const DOCS_FOLDER_NAME = "docs";
+export const TYPES_FOLDER_NAME = "typeTemplates";
+export const EXPORTED_TYPES_FOLDER_NAME = "."; // root
+
+export const JSDOC_IMG_HEIGHT = "200";
+export const JSDOC_IMG_WIDTH = "300";
+
+export const DOUBLE_LINE_BREAK_WITH_LEADING_COMMENT = "\n *\n";
+export const LINE_BREAK = "\n";
+export const JSDOC_EXAMPLE_TAG = "@example ";
+export const JSDOC_END_EXAMPLE_TAG = "@endexample";
+export const ASTERISK = "*";
+export const ASTERISK_WITH_SPACES = " * ";
+export const WHITESPACE_PARENTHESIS_REGEX = /[\s()]/g;

package/configs/scripts/jsdoc-builder/index.mjs

@@ -0,0 +1,67 @@
+import fs from "fs";
+import path from "path";
+
+import _generate from "@babel/generator";
+import _traverse from "@babel/traverse";
+import * as babelTypes from "@babel/types";
+
+import {
+  DOCS_FOLDER_NAME,
+  EXPORTED_TYPES_FOLDER_NAME,
+  TYPES_FOLDER_NAME,
+} from "./constants.mjs";
+import {
+  buildEntityTitleToEntityDescMap,
+  getFileContent,
+  getFileNameList,
+  parseMarkdown,
+  parseTypeFile,
+  syncTypeFiles,
+  defaultTypeFileTraverser,
+} from "./utils.mjs";
+
+const traverse = _traverse.default;
+const generate = _generate.default;
+
+const buildJsdoc = ({
+  customTypeFileTraverser = defaultTypeFileTraverser,
+  exportedTypesFolderName = EXPORTED_TYPES_FOLDER_NAME,
+} = {}) => {
+  const fileNamesInsideDocs = getFileNameList(path.resolve(DOCS_FOLDER_NAME));
+  const typeFileNames = fs.readdirSync(path.resolve(TYPES_FOLDER_NAME));
+
+  syncTypeFiles(exportedTypesFolderName);
+
+  const entityTitleToDescMapOfAllFiles = {};
+
+  fileNamesInsideDocs.forEach(docFileName => {
+    const fileContent = getFileContent(docFileName);
+    const markdownAST = parseMarkdown(fileContent);
+
+    buildEntityTitleToEntityDescMap(
+      markdownAST.children,
+      entityTitleToDescMapOfAllFiles
+    );
+  });
+
+  // eslint-disable-next-line consistent-return
+  typeFileNames.forEach(typeFileName => {
+    const typeFileContent = getFileContent(
+      path.join(exportedTypesFolderName, typeFileName)
+    );
+    const typeFileAST = parseTypeFile(typeFileContent);
+
+    customTypeFileTraverser({
+      typeFileName: `${exportedTypesFolderName}/${typeFileName}`,
+      typeFileAST,
+      entityTitleToDescMapOfAllFiles,
+      babelTraverse: traverse,
+      babelCodeGenerator: generate,
+      babelTypes,
+    });
+  });
+
+  console.log("Successfully added JSDoc comments to type files.");
+};
+
+export default buildJsdoc;

package/configs/scripts/jsdoc-builder/utils.mjs

@@ -0,0 +1,228 @@
+import fs from "fs";
+import path from "path";
+
+import * as babelParser from "@babel/parser";
+import { mergeLeft } from "ramda";
+import remarkParse from "remark-parse";
+import { unified } from "unified";
+
+import {
+  ASTERISK,
+  ASTERISK_WITH_SPACES,
+  CODE_PATTERN,
+  DOUBLE_LINE_BREAK_WITH_LEADING_COMMENT,
+  HTML_EXCEPT_IMG_PATTERN,
+  IMG_PATTERN,
+  JSDOC_EXAMPLE_TAG,
+  JSDOC_END_EXAMPLE_TAG,
+  JSDOC_IMG_HEIGHT,
+  JSDOC_IMG_WIDTH,
+  LINE_BREAK,
+  PARAGRAPH_PATTERN,
+  SUBHEADING_PATTERN,
+  TYPES_FOLDER_NAME,
+  WHITESPACE_PARENTHESIS_REGEX,
+} from "./constants.mjs";
+import * as babelTypes from "@babel/types";
+import _traverse from "@babel/traverse";
+import _generate from "@babel/generator";
+
+import { matches } from "@bigbinary/neeto-cist";
+
+const traverse = _traverse.default;
+const generate = _generate.default;
+
+const removeWhiteSpaceAndParentheses = string =>
+  string.replace(WHITESPACE_PARENTHESIS_REGEX, "");
+
+const addLeadingCommentForTextWithLineBreaks = ({
+  text,
+  addCommentForFirstItem = true,
+  addDoubleLineBreaks = true,
+}) => {
+  if (!hasLineBreaks(text)) return addLeadingComment(text);
+  const joinString = addDoubleLineBreaks
+    ? DOUBLE_LINE_BREAK_WITH_LEADING_COMMENT
+    : LINE_BREAK;
+
+  return text
+    .split(LINE_BREAK)
+    .map((item, idx) => {
+      if (!addCommentForFirstItem && idx === 0) return item;
+
+      return addLeadingComment(item);
+    })
+    .join(joinString);
+};
+
+const addLeadingComment = (text, trimWhiteSpace = false) =>
+  (trimWhiteSpace ? ASTERISK : ASTERISK_WITH_SPACES) + text;
+
+const transformCode = node => {
+  let text = "";
+  text += addLeadingComment(JSDOC_EXAMPLE_TAG);
+  text += DOUBLE_LINE_BREAK_WITH_LEADING_COMMENT;
+  text += addLeadingCommentForTextWithLineBreaks({
+    text: removeCommentTags(node.value),
+    addDoubleLineBreaks: false,
+  });
+  text += LINE_BREAK;
+  text += addLeadingComment(JSDOC_END_EXAMPLE_TAG);
+  text += LINE_BREAK;
+
+  return text;
+};
+
+const hasLineBreaks = text => text?.includes(LINE_BREAK);
+
+const getParagraphChildrenText = node => {
+  const children = node.children;
+  if (children.length === 1) return children[0].value;
+
+  return children.map(child => child.value || child.children[0].value).join("");
+};
+
+const transformParagraph = node => {
+  let text = "";
+  text += ASTERISK_WITH_SPACES;
+  const childrenText = getParagraphChildrenText(node);
+
+  if (hasLineBreaks(childrenText)) {
+    text += addLeadingCommentForTextWithLineBreaks({
+      text: childrenText,
+      addCommentForFirstItem: false,
+    });
+  } else {
+    text += childrenText;
+  }
+  text += DOUBLE_LINE_BREAK_WITH_LEADING_COMMENT;
+
+  return text;
+};
+
+const transformImg = node => {
+  const { src, alt } = parseImgTag(node.value);
+  let text = ASTERISK_WITH_SPACES;
+  text += `![${alt}](${src}|height=${JSDOC_IMG_HEIGHT}|width=${JSDOC_IMG_WIDTH})`;
+  text += DOUBLE_LINE_BREAK_WITH_LEADING_COMMENT;
+
+  return text;
+};
+
+const transformNodesToText = nodes => {
+  let text = DOUBLE_LINE_BREAK_WITH_LEADING_COMMENT;
+
+  nodes.forEach(node => {
+    if (matches(CODE_PATTERN, node)) {
+      text += transformCode(node);
+    } else if (matches(IMG_PATTERN, node)) {
+      text += transformImg(node);
+    } else if (matches(PARAGRAPH_PATTERN, node)) {
+      text += transformParagraph(node);
+    }
+  });
+
+  return addLeadingComment(text, true);
+};
+
+const parseImgTag = imgTagStr =>
+  imgTagStr.split(" ").reduce((acc, item) => {
+    let [attrName, attrValue] = item.split("=");
+    attrValue = attrValue?.replaceAll(">", "").replaceAll('"', "");
+
+    return mergeLeft({ [attrName]: attrValue }, acc);
+  }, {});
+
+const removeCommentTags = str => str.replaceAll("/*", "").replaceAll("*/", "");
+
+export const parseTypeFile = typeFileContent =>
+  babelParser.parse(typeFileContent, {
+    sourceType: "module",
+    plugins: [["typescript", { dts: true }]],
+  });
+
+export const buildEntityTitleToEntityDescMap = (nodes, map) => {
+  nodes.forEach((node, idx) => {
+    if (!matches(SUBHEADING_PATTERN, node)) return;
+
+    const entityName = removeWhiteSpaceAndParentheses(node.children[0].value);
+    const entityRightSiblings = [];
+
+    for (let i = idx + 1; i < nodes.length; i++) {
+      const siblingNode = nodes[i];
+
+      if (matches(HTML_EXCEPT_IMG_PATTERN, siblingNode)) continue;
+
+      if (matches(SUBHEADING_PATTERN, siblingNode)) break;
+
+      entityRightSiblings.push(siblingNode);
+    }
+    const entityRightSiblingsText = transformNodesToText(entityRightSiblings);
+    map[entityName] = entityRightSiblingsText;
+  });
+};
+
+export const syncTypeFiles = exportedTypesFolderName => {
+  const sourceDir = path.resolve(TYPES_FOLDER_NAME);
+  const destDir = path.resolve(exportedTypesFolderName);
+
+  fs.cpSync(sourceDir, destDir, { recursive: true });
+};
+
+export const getFileNameList = dirPath => {
+  let files = [];
+  const items = fs.readdirSync(dirPath, { withFileTypes: true });
+
+  for (const item of items) {
+    if (item.isDirectory()) {
+      files = [...files, ...getFileNameList(path.join(dirPath, item.name))];
+    } else {
+      files.push(path.join(dirPath, item.name));
+    }
+  }
+
+  return files;
+};
+
+export const getFileContent = fileName =>
+  fs.readFileSync(path.resolve(fileName), "utf8").toString();
+
+export const parseMarkdown = fileContent =>
+  unified().use(remarkParse).parse(fileContent);
+
+export const defaultTypeFileTraverser = options => {
+  traverse(options.typeFileAST, {
+    VariableDeclaration: ({ node }) =>
+      handleNode({
+        node,
+        options,
+        extractEntityName: findVariableDeclarationName,
+      }),
+    ClassProperty: ({ node }) =>
+      handleNode({ node, options, extractEntityName: findClassPropertyName }),
+  });
+};
+
+export const findVariableDeclarationName = node =>
+  node?.declarations?.[0]?.id?.name || node?.declaration?.id?.name;
+
+export const findClassPropertyName = node => node?.key?.name;
+
+export const handleNode = ({
+  node,
+  extractEntityName,
+  options: { entityTitleToDescMapOfAllFiles, typeFileName, typeFileAST },
+}) => {
+  const entityName = extractEntityName(node);
+  const entityDesc = entityTitleToDescMapOfAllFiles[entityName];
+
+  if (!entityName || !entityDesc) {
+    return;
+  }
+
+  babelTypes.addComment(node, "leading", entityDesc);
+
+  const { code } = generate(typeFileAST, {});
+
+  fs.writeFileSync(path.resolve(typeFileName), code);
+};

package/index.cjs.js

@@ -13991,7 +13991,7 @@ const memberUtils = {
 
 const assertColumnHeaderVisibility = async ({ page, columnName, shouldBeVisible, }) => {
     const visibilityAssertion = shouldBeVisible ? "toBeVisible" : "toBeHidden";
-    await test$1.expect(page.getByRole("columnheader", { name: columnName }))[visibilityAssertion]();
+    await test$1.expect(page.getByRole("columnheader", { name: columnName, exact: true }))[visibilityAssertion]();
 };
 const verifyTableColumnsExistence = async ({ page, columnNames, }) => {
     await Promise.all(columnNames.map(columnName => test$1.expect(page.getByRole("columnheader", { name: columnName, exact: true })).toBeVisible()));
@@ -14002,8 +14002,7 @@ const toggleColumnCheckboxAndVerifyVisibility = async ({ page, tableColumns, sho
         const checkbox = page
             .getByTestId(COMMON_SELECTORS.columnsDropdownContainer)
             .getByRole("listitem")
-            .filter({ hasText: columnName })
-            .getByRole("checkbox");
+            .getByRole("checkbox", { name: columnName, exact: true });
         const isCheckBoxChecked = await checkbox.isChecked();
         if (isCheckBoxChecked !== shouldBeChecked) {
             await checkbox.click();