docs__myblog__other__test.md.js

(window["webpackJsonp"]=window["webpackJsonp"]||[]).push([[80],{"8wqq":function(e,n,a){e.exports=a.p+"static/result_fail.fc8ec157.png"},fMKh:function(e,n,a){e.exports=a.p+"static/test.74e8d621.png"},lOIk:function(e,n,a){e.exports=a.p+"static/result.8dca3444.png"},ziRE:function(e,n,a){"use strict";a.r(n);var t=a("q1tI"),r=a.n(t),s=a("dEAq"),o=a("H1Ra"),l=r.a.memo((e=>{e.demos;return r.a.createElement(r.a.Fragment,null,r.a.createElement("div",{className:"markdown"},r.a.createElement("p",null,"\u6d4b\u8bd5\u4e3b\u8981\u662f\u4fdd\u6301\u9879\u76ee\u7684\u6b63\u786e\u6027\u3001\u81ea\u52a8\u5316\u3001\u89e3\u91ca\u6027\u3001\u9a71\u52a8\u5f00\u53d1\u3001\u4fdd\u8bc1\u91cd\u6784\u3002"),r.a.createElement("h2",{id:"\u5355\u5143\u6d4b\u8bd5"},r.a.createElement(s["AnchorLink"],{to:"#\u5355\u5143\u6d4b\u8bd5","aria-hidden":"true",tabIndex:-1},r.a.createElement("span",{className:"icon icon-link"})),"\u5355\u5143\u6d4b\u8bd5"),r.a.createElement("p",null,"\u5355\u5143\u6d4b\u8bd5\u80fd\u591f\u8ba9\u5f00\u53d1\u8005\u660e\u786e\u77e5\u9053\u4ee3\u7801\u7684\u7ed3\u679c \u6d4b\u8bd5\u98ce\u683c\uff1a\u6d4b\u8bd5\u9a71\u52a8\u5f00\u53d1\uff0cTDD \u5173\u6ce8\u6240\u6709\u7684\u529f\u80fd\u662f\u5426\u88ab\u5b9e\u73b0\uff08\u6bcf\u4e00\u4e2a\u529f\u80fd\u90fd\u5fc5\u987b\u6709\u5bf9\u5e94\u7684\u6d4b\u8bd5\u7528\u4f8b\uff09 BDD \u5173\u6ce8\u6574\u4f53\u884c\u4e3a\u662f\u5426\u7b26\u5408\u6574\u4f53\u9884\u671f\uff0c\u7f16\u5199\u7684\u6bcf\u4e00\u884c\u4ee3\u7801\u90fd\u6709\u76ee\u7684\u7684\u63d0\u4f9b\u4e00\u4e2a\u5168\u9762\u7684\u6d4b\u8bd5\u7528\u4f8b\u96c6 \u5355\u5143\u6d4b\u8bd5\u8fd0\u884c\u6d41\u7a0b"),r.a.createElement("img",{src:a("fMKh")}),r.a.createElement("p",null,"\u5efa\u4e00\u4e2a index.spec.js //spec \u8868\u793a\u662f\u4e00\u4e2a\u6d4b\u8bd5\u6587\u4ef6\uff0c\u5355\u5143\u6d4b\u8bd5\u6700\u5916\u5c42\u90fd\u8981\u5305\u4e00\u5c42 describe, \u9996\u5148\u662f\u65b0\u5efa\u9879\u76ee\uff0c\u7136\u540e npm init -y \u521b\u5efa package.json"),r.a.createElement(o["a"],{code:"describe('\u51fd\u6570\u7684+1\u57fa\u672c\u6d4b\u8bd5\u7528\u4f8b', function() {\n  it('+1\u6d4b\u8bd5\u51fd\u6570', function() {\n    expect(window.add(1)).toBe(2);\n  });\n});",lang:"js"}),r.a.createElement("p",null,"\u5b89\u88c5 karma ",r.a.createElement("code",null,"yarn add karma karma-jasmine"),"package.json \u91cc\u9762\u65b0\u589e"),r.a.createElement(o["a"],{code:'"scripts": {\n  "init": "karma init"\n}',lang:"js"}),r.a.createElement("p",null,"\u6267\u884c ",r.a.createElement("code",null,"npm run init")," \u751f\u6210 karma.conf.js"),r.a.createElement(o["a"],{code:"// Karma configuration\n// Generated on Wed Jul 08 2020 14:41:16 GMT+0800 (GMT+08:00)\n\nmodule.exports = function(config) {\n  config.set({\n    // base path that will be used to resolve all patterns (eg. files, exclude)\n    basePath: '',\n\n    // frameworks to use\n    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter\n    frameworks: ['jasmine'],\n\n    // list of files / patterns to load in the browser, \u9700\u8981\u6267\u884c\u7684\u6d4b\u8bd5\u6587\u4ef6\n    files: ['./src/**/*.js', './tests/unit/**/*.spec.js'],\n\n    // list of files / patterns to exclude\n    exclude: [],\n\n    // preprocess matching files before serving them to the browser\n    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor\n    preprocessors: {},\n\n    // test results reporter to use\n    // possible values: 'dots', 'progress'\n    // available reporters: https://npmjs.org/browse/keyword/karma-reporter\n    reporters: ['progress'],\n\n    // web server port\n    port: 9876,\n\n    // enable / disable colors in the output (reporters and logs)\n    colors: true,\n\n    // level of logging\n    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG\n    logLevel: config.LOG_INFO,\n\n    // enable / disable watching file and executing tests whenever any file changes\n    autoWatch: true,\n\n    // \u8bbe\u7f6e\u6d4f\u89c8\u5668\n    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher\n    browsers: ['Chrome'],\n\n    // Continuous Integration mode\n    // if true, Karma captures browsers, runs the tests and exits\n    singleRun: true,\n\n    // Concurrency level\n    // how many browser should be started simultaneous\n    concurrency: Infinity,\n  });\n};",lang:"js"}),r.a.createElement("p",null,"\u7136\u540e\u6267\u884c",r.a.createElement("code",null,"npm start")," \uff0c\u5c31\u4f1a\u6253\u5f00\u6d4f\u89c8\u5668\uff08\u56e0\u4e3a\u6211\u9009\u62e9\u7684\u662f chrome \u6d4f\u89c8\u5668)\uff0c\u5982\u679c\u6210\u529f\u4e86\u4f1a\u51fa\u73b0\u5982\u4e0b\u7ed3\u679c"),r.a.createElement("img",{src:a("lOIk")}),r.a.createElement("p",null,"\u4e0b\u9762\u662f\u6ca1\u901a\u8fc7\u6d4b\u8bd5\u7528\u4f8b\u8fd4\u56de"),r.a.createElement("img",{src:a("8wqq")}),r.a.createElement("p",null,"\u4f46\u662f\u8fd9\u6837\u6d4b\u8bd5\u51fa\u6765\u7684\u7ed3\u679c\u53ef\u4ee5\u81ea\u5df1\u770b\u5230\uff0c\u4f46\u662f\u5982\u679c\u522b\u4eba\u9700\u8981\u770b\u5462\uff0c\u90a3\u600e\u4e48\u529e\uff0c\u90a3\u5c31\u9700\u8981\u5355\u5143\u8986\u76d6\u7387\u4e86\uff0c \u5c31\u9700\u8981\u7528\u5230 ",r.a.createElement("code",null,"karma-coverage")),r.a.createElement("p",null,"\u4e0b\u8f7d",r.a.createElement("code",null,"karma-coverage")),r.a.createElement(o["a"],{code:"yarn add karma-coverage",lang:"js"}),r.a.createElement(o["a"],{code:"karma.conf.js\n//\u65b0\u589e\nreporters: ['progress','coverage'],\n\npreprocessors: {\n  // source files, that you wanna generate coverage for\n  // do not include tests or libraries\n  // (these files will be instrumented by Istanbul)\n  'src/**/*.js': ['coverage']\n},\ncoverageReporter: {\n  type : 'html',\n  dir : 'docs/coverage/'\n},",lang:"js"}),r.a.createElement("h2",{id:"ui-\u6d4b\u8bd5"},r.a.createElement(s["AnchorLink"],{to:"#ui-\u6d4b\u8bd5","aria-hidden":"true",tabIndex:-1},r.a.createElement("span",{className:"icon icon-link"})),"UI \u6d4b\u8bd5"),r.a.createElement("p",null,"\u5c31\u662f\u524d\u7aef\u5199\u51fa\u6765\u7684\u9875\u9762\u548c\u8bbe\u8ba1\u7a3f\u5bf9\u6bd4\u3002\u539f\u7406\u662f\u4e00\u4e2a\u50cf\u7d20\u662f\u7531\u56db\u4e2a\u70b9\u7ec4\u6210\uff08\u5c31\u662f rgba)\uff0c\u4e00\u4e2a\u70b9\u4e00\u4e2a\u70b9\u7684\u5bf9\u6bd4\u4f4d\u7f6e\u662f\u5426\u4e00\u6837"),r.a.createElement("p",null,"\u4e3b\u8981\u5c31\u662f\u7528",r.a.createElement("code",null,"backstopjs"),"\u8fd9\u4e2a\u5e93"),r.a.createElement(o["a"],{code:'yarn add backstopjs\n\n//package.json\u65b0\u589e\n"init2": "backstop init",\n"test2": "backstop test"',lang:"js"}),r.a.createElement("p",null,"\u6267\u884c ",r.a.createElement("code",null,"backstop init2"),",\u751f\u6210\u4e86",r.a.createElement("code",null,"backstop.json")),r.a.createElement(o["a"],{code:'{\n  "id": "backstop_default",\n  "viewports": [\n    {\n      "label": "phone",\n      "width": 375,\n      "height": 667\n    },\n    {\n      "label": "tablet",\n      "width": 1024,\n      "height": 768\n    }\n  ],\n  "onBeforeScript": "puppet/onBefore.js",\n  "onReadyScript": "puppet/onReady.js",\n  "scenarios": [\n    {\n      "label": "BackstopJS Homepage",\n      "cookiePath": "backstop_data/engine_scripts/cookies.json",\n      "url": "http://full.ezquant.cn/#/index",//\u7ebf\u4e0a\u5bf9\u6bd4\u5730\u5740\n      "referenceUrl": "",\n      "readyEvent": "",\n      "readySelector": "",\n      "delay": 0,\n      "hideSelectors": [],\n      "removeSelectors": [],\n      "hoverSelector": "",\n      "clickSelector": "",\n      "postInteractionWait": 0,\n      "selectors": [],\n      "selectorExpansion": true,\n      "expect": 0,\n      "misMatchThreshold" : 0.1,\n      "requireSameDimensions": true\n    }\n  ],\n  "paths": {\n    "bitmaps_reference": "backstop_data/bitmaps_reference", //\u8fd9\u4e2a\u662f\u8bbe\u8ba1\u7a3f\u7684\u6587\u4ef6\u5939\n    "bitmaps_test": "backstop_data/bitmaps_test",           //\u8fd9\u4e2a\u662f\u9700\u8981\u5bf9\u6bd4\u7684\u6587\u4ef6\u5939\n    "engine_scripts": "backstop_data/engine_scripts",\n    "html_report": "backstop_data/html_report",\n    "ci_report": "backstop_data/ci_report"\n  },\n  "report": ["browser"],\n  "engine": "puppeteer",\n  "engineOptions": {\n    "args": ["--no-sandbox"]\n  },\n  "asyncCaptureLimit": 5,\n  "asyncCompareLimit": 50,\n  "debug": false,\n  "debugWindow": false\n}',lang:"js"}),r.a.createElement("h2",{id:"\u81ea\u52a8\u5316\u6d4b\u8bd5e2e"},r.a.createElement(s["AnchorLink"],{to:"#\u81ea\u52a8\u5316\u6d4b\u8bd5e2e","aria-hidden":"true",tabIndex:-1},r.a.createElement("span",{className:"icon icon-link"})),"\u81ea\u52a8\u5316\u6d4b\u8bd5(e2e)"),r.a.createElement("p",null,"\u6700\u5e38\u7528\u7684\u662f selenium-webdriver\uff0c\u4e0b\u8f7d chromedriver \u653e\u5728\u9879\u76ee\u6839\u76ee\u5f55\u4e0b\u9762 \u4e0b\u8f7d\u63d2\u4ef6 ",r.a.createElement("code",null,"yarn add selenium-webdriver")),r.a.createElement(o["a"],{code:"const { Builder, By, Key, until } = require('selenium-webdriver');\n\n(async function example() {\n  let driver = await new Builder().forBrowser('chrome').build();\n  try {\n    await driver.get('http://www.baidu.com');\n    await driver\n      .findElement(By.name('wd'))\n      .sendKeys('\u602a\u4f60\u8fc7\u5206\u7f8e\u4e3d', Key.RETURN);\n    await driver.wait(until.titleIs('\u602a\u4f60\u8fc7\u5206\u7f8e\u4e3d_\u767e\u5ea6\u641c\u7d22'), 1000);\n  } finally {\n    await driver.quit();\n  }\n})();",lang:"js"}),r.a.createElement("p",null,"\u5982\u679c\u80fd\u6253\u5f00\u6d4f\u89c8\u5668\u5728\u8f93\u5165\u6846\u8f93\u5165\u602a\u4f60\u8fc7\u5206\u7f8e\u4e3d\u5e76\u641c\u7d22\u51fa\u7ed3\u679c\u5c31\u662f\u6210\u529f"),r.a.createElement("p",null,r.a.createElement(s["Link"],{to:"https://rize.js.org/zh-CN/"},"rise \u5b98\u7f51")),r.a.createElement("p",null,"\u9996\u5148\u4e0b\u8f7d ",r.a.createElement("code",null,"yarn add puppeteer rize -D")),r.a.createElement(o["a"],{code:"const Rize = require('rize');\n\nconst rize = new Rize();\nrize\n  .goto('https://github.com/')\n  .type('input.header-search-input', 'node')\n  .press('Enter')\n  .waitForNavigation()\n  .assertSee('Node.js')\n  .end(); // \u522b\u5fd8\u4e86\u8c03\u7528 `end` \u65b9\u6cd5\u6765\u9000\u51fa\u6d4f\u89c8\u5668\uff01",lang:"js"}),r.a.createElement("h2",{id:"\u5b89\u5168\u6d4b\u8bd5"},r.a.createElement(s["AnchorLink"],{to:"#\u5b89\u5168\u6d4b\u8bd5","aria-hidden":"true",tabIndex:-1},r.a.createElement("span",{className:"icon icon-link"})),"\u5b89\u5168\u6d4b\u8bd5"),r.a.createElement("h2",{id:"\u6027\u80fd\u6d4b\u8bd5"},r.a.createElement(s["AnchorLink"],{to:"#\u6027\u80fd\u6d4b\u8bd5","aria-hidden":"true",tabIndex:-1},r.a.createElement("span",{className:"icon icon-link"})),"\u6027\u80fd\u6d4b\u8bd5")))}));n["default"]=e=>{var n=r.a.useContext(s["context"]),a=n.demos;return r.a.useEffect((()=>{var n;null!==e&&void 0!==e&&null!==(n=e.location)&&void 0!==n&&n.hash&&s["AnchorLink"].scrollToAnchor(decodeURIComponent(e.location.hash.slice(1)))}),[]),r.a.createElement(l,{demos:a})}}}]);