☰

一键生成RDC测试用例的Cypress自动化用例结构

根据当前用例的标题、领域等字段生成Cypress的用例代码结构

As of 2024-11-05. See the latest version.

// ==UserScript==
// @name         一键生成RDC测试用例的Cypress自动化用例结构
// @namespace    http://tampermonkey.net/
// @version      0.0.1
// @description  根据当前用例的标题、领域等字段生成Cypress的用例代码结构
// @author       袁龙辉
// @match        https://rdcloud.zte.com.cn/*
// @match        https://studio.zte.com.cn/*
// @icon         data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAbCAYAAACJISRoAAAABHNCSVQICAgIfAhkiAAAAQtJREFUSInt1c1Kw0AUhuFTF8kFTJnAFFwKYrHQUjE0Fq2iOxG8Bn/vQ8SbEMX+oLhQ9+raXom9g0lI8roQBDdmFi0q5FsOfOdZDIdTAZAZZ27WQImUyC8ju3v7Ug1q0tva+fZ+dn4h1aAmYacreZ7/PISCPL+8orRBacPbeAyAtZaFxTpKG27v7otGUIgAbGxuo7Th4OgEgMFwhNKGVjskTdPpIA+PTyhtCMw875MJ671PtD8YudTdkCzLWFmNUNpweHyK0oZGs02SJNNDAG76w6+/UdpweXXtWnVH4jim3mihtGFpuYm11hlx3hPP86S7FomISNQJxfd91+ofWcZ/g1SgPL8lUiIF+QCIeCJE+P0wYgAAAABJRU5ErkJggg==
// @grant        GM_addStyle
// @grant        GM_setClipboard
// ==/UserScript==

(function () {
  GM_addStyle(
    `#generate_st_btn {
              height: 28px;
              padding: 4px 8px;
              background: #07f;
              color: #fff;
              border: none;
              border-radius: 4px;
              cursor: pointer;
          }
          #generate_st_alert {
              display: none;
              position: fixed;
              top: 5%;
              left: 50%;
              transform: translate(-50%, -50%);
              padding: 20px;
              background-color: #f8d7da;
              color: #721c24;
              border: 1px solid #f5c6cb;
              border-radius: 5px;
              box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
              z-index: 99999;
        }`
  );

  // 用例作者
  const name = "袁龙辉";

  window.onpopstate = function () {
    main();
  };

  function main() {
    const targetSelector = ".item-detail-lay";
    const typeContent = "测试用例";

    const observer = new MutationObserver((mutations) => {
      mutations.forEach((mutation) => {
        if (mutation.addedNodes.length > 0) {
          const popup = document.querySelector(targetSelector);
          if (popup) {
            const typeElement = popup.querySelector(".work-item-type-name");
            // 判断是测试用例类型的弹窗
            if (typeElement.textContent.includes(typeContent)) {
              const alertBox = document.getElementById("generate_st_alert");
              if (!alertBox) {
                const alertBox = document.createElement("div");
                alertBox.setAttribute("id", "generate_st_alert");
                alertBox.textContent =
                  "用例结构已生成到剪切板，请复制到Cypress项目中。";
                document.body.appendChild(alertBox);
              }
              const insertAfterElement = popup.querySelector(
                ".tag_wrapper.tags-view"
              );
              if (
                insertAfterElement &&
                !document.querySelector("#generate_st_btn")
              ) {
                const button = document.createElement("button");
                button.id = "generate_st_btn";
                button.textContent = "生成Cypress用例结构";
                button.onclick = () => {
                  generateCode();
                  showAlert();
                };

                insertAfterElement.parentNode.insertBefore(
                  button,
                  insertAfterElement.nextSibling
                );
              }
            }
          }
        }
      });
    });
    var config = { childList: true, subtree: true };
    var target = document.body;
    observer.observe(target, config);
  }
  main();

  function generateCode() {
    const titleEle = document.getElementById("input-title");
    const title = titleEle.value.trim();
    const tags = JSON.stringify(
      Array.from(
        new Set(
          [getAreaTag()]
            .concat(getMajorTag())
            .map((item) => item.match(/@\w+/g)) // 匹配@开头的单词
            .flat() // 将结果展开为一维数组
            .filter(Boolean) // 过滤掉 null 或 undefined 的值
        )
      )
    ).replace(/,/g, ", ");

    const result = `it('${title}【作者-${name}】', { tags: ${tags} }, function () {
      // 用例步骤代码
    })`;
    GM_setClipboard(result);
  }

  function showAlert() {
    const alertBox = document.getElementById("generate_st_alert");
    alertBox.style.display = "block";
    setTimeout(() => {
      alertBox.style.display = "none";
    }, 1500);
  }

  function getAreaTag() {
    const areaPathEle = document.querySelector(
      ".System_AreaPath-key-field-content input"
    );
    const areaPath = areaPathEle.value.trim();
    const areaPathMap = {
      LCAP远航团队: "@ProEnvCsST",
      低代码长沙特性2组: "@ProEnvCsST",
      低代码南京特性1组: "@ProEnvNJ1ST",
      低代码三亚特性1组: "@ProEnvSY1ST",
      南京工作项中心1组: "@ProEnvGZX1ST",
      南京工作项中心2组: "@ProEnvGZX2ST",
    };
    return areaPathMap[areaPath];
  }

  function getMajorTag() {
    const parentElement = document.querySelector(
      ".AreaMajorCategory-key-field-content"
    );
    const spanElements = parentElement.querySelectorAll(
      ".el-select__tags-text"
    );
    const textArray = Array.from(spanElements).map((span) => span.textContent);
    return textArray;
  }
})();