正文 

当前位置： 首页 > java > java教程

cypress学习1-windows环境npm安装cypress(代码片段)

yoyoketang yoyoketang     2022-12-04     569

关键词：

前言

web技术已经进化了，web的测试技术最终还是跟上了脚步，新一代的web自动化技术出现了？
Cypress可以对在浏览器中运行的任何东西进行快速、简单和可靠的测试。

"The web has evolved.
Finally, testing has too.
Fast, easy and reliable testing for anything that runs in a browser."

官方地址https://www.cypress.io/,详细的文档介绍https://docs.cypress.io/guides/overview/why-cypress.html

windows环境安装

系统要求：

  • macOS 10.9 and above (64-bit only)
  • Linux Ubuntu 12.04 and above, Fedora 21 and Debian 8 (64-bit only)
  • Windows 7 and above

如果你使用 npm 安装 Cypress，必须要求 Node.js 8 或更高版本

安装node.js

官网下载地址：https://nodejs.org/en/download/
技术图片

下载后一路傻瓜式安装，安装完成后，运行cmd，输入node –v查看版本号，然后输入npm -v

C:Usersdell>node -v
v10.2.0

C:Usersdell>npm -v
6.14.5

npm安装

NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种：

  • 允许用户从NPM服务器下载别人编写的第三方包到本地使用。
  • 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
  • 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。

由于新版的nodejs已经集成了 npm，所以之前 npm也 一并安装好了。可以通过输入 "npm -v"来测试是否成功安装.

npm -v

如果npm版本过低，也可以通过以下指令升级npm版本

npm install npm -g

npm直接下载会很慢，先修改下载源http://registry.npm.taobao.org

npm config set registry http://registry.npm.taobao.org

改完之后查看是否改成功

npm config get registry

安装 Cypress

自己本地电脑新建一个目录，cd 到目录，执行 npm 指令安装

cd /your/project/path
npm install cypress --save-dev

安装会有点慢，耐心等待！

D:Cypress>npm install cypress --save-dev

> cypress@4.5.0 postinstall D:Cypress
ode_modulescypress
> node index.js --exec install

Installing Cypress (version: 4.5.0)

  √  Downloaded Cypress
  √  Unzipped Cypress
  √  Finished Installation C:UsersdellAppDataLocalCypressCache4.5.0

You can now open Cypress by running: node_modules.bincypress open

https://on.cypress.io/installing-cypress

npm WARN saveError ENOENT: no such file or directory, open ‘D:Cypresspackage.json‘
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN enoent ENOENT: no such file or directory, open ‘D:Cypresspackage.json‘
npm WARN Cypress No description
npm WARN Cypress No repository field.
npm WARN Cypress No README data
npm WARN Cypress No license field.

+ cypress@4.5.0
updated 1 package in 1142.836s

1 package is looking for funding
  run `npm fund` for details

启动cypress

先cd到node_modules/.bin目录

cd node_modules/.bin
cypress open

D:Cypress
ode_modules.bin>cypress open
It looks like this is your first time using Cypress: 4.5.0

  √  Verified Cypress! C:UsersdellAppDataLocalCypressCache4.5.0Cypress

Opening Cypress...

接下来桌面会出现启动界面

技术图片

也可以通过 npx 来启动,这样就不用cd 到 node_modules.bin 目录了

npx cypress open

还可以通过 yarn 来启动

yarn run cypress open

添加 npm 脚本

在前面安装的时候，会看到缺少个文件 npm WARN saveError ENOENT: no such file or directory, open ‘D:Cypresspackage.json‘
接下来在根目录 D:Cypress 下新建一个 package.json 文件


  "scripts": 
    "cypress:open": "cypress open"

现在，您可以从项目根目录调用命令，如下所示：

npm run cypress:open

D:Cypress
ode_modules.bin>npm run cypress:open

> @ cypress:open D:Cypress
> cypress open

接下来就可以看到正确的启动 cypress 界面了

技术图片

这里面有一些js的案例脚本可以直接点下，就能看到运行效果了！

mac的安装教程，查看官方文档https://docs.cypress.io/guides/getting-started/installing-cypress.html#Switching-browsers








cypress前端自动化测试工具——环境搭建初步实现ui自动化与selenium做对比(代码片段)

安装准备cypress是前端的自动化框贺，所以首次应安装npm.安装nmp见另一篇文章npm环境搭建安装cypresscd/your/project/pathcnpmicypress-g或npminstallcypress--save-dev启动cypress进入安装目录，输入cypressopen启动cypress程序下图红框是手动输入执行的... 查看详情

从0开始学习自动化测试框架cypress(代码片段)

安装cypress前提是已经安装nodejsmkdircypresscdcypressnpminstallcypress--save-dev--registry=https://registry.npm.taobao.org报以上的错,就直接下载windows的zip绿色包运行即可: https://cdn.cypress.io/desktop/6.4.0/win32-x64/cypres 查看详情

no.1一步步学习vuejs环境配置安装篇

一安装与配置需要安装node.js和nmp管理器http://nodejs.cn/安装完后测试输入命令查看版本验证node-v//查看node.js的版本npm-v//查看 由于有些npm有些资源被屏蔽或者是国外资源的原因，经常会导致用npm安装依赖包的时候失败，所有我... 查看详情

初识cypress

...测试这块，一直都是人工去测，不免太耗时。所以想试试Cypress，希望能有收获。我在selenium和cypress这两个框架中纠结，最后选择这个框架的初心很简单，老公推荐的，哈哈，我信他。然后就开始了我的自动化测试之旅。首先，... 查看详情

node-学习之路01npm

1.node环境快速搭建网址 搭建环境的地址2.前端知识网址 点击我3.npm使用node-v查看版本npm-v查看版本搜索去www.npmjs.comnpminstall包名安装这个包npmremove包名删除包 npminstall包名-g全局安装 npminstall包名--save 安装到依赖... 查看详情

window下载安装node后，运行npm报错“module.js:472”是怎么回事？

...dejs。参考技术A解决办法：npminstall重新安装以后，配置：Windows是窗户的意思。另外还有微软公司推出的视窗电脑操作系统名为Windows。随着电脑硬件和软件系统的不断升级，微软的Windows操作系统也在不断升级，从16位、32位到64位... 查看详情

npm install cypress vs npm install cypress --save-dev

】npminstallcypressvsnpminstallcypress--save-dev【英文标题】：【发布时间】：2021-11-1102:18:47【问题描述】：我是cypress的新手，想知道npminstallcypress和npminstallcypress--save-dev之间的区别我用谷歌搜索但没有找到任何答案【问题讨论】：参见th... 查看详情

reactnative学习环境搭建

需安装工具RN环境：[必须]Node[必须]react-native-cli[可选]NodePackageManager(npm):node包管理工具,一般安装Node会带上npm*[可选]NodeVersionManager(nvm):node版本管理工具*[可选]watchman*[可选]flowiOS端：[必须]Xcode安卓端：[必须]Java环境[必须]AndroidStudio... 查看详情

vue学习起步，vue环境安装

vue安装的前提是安装了nodejs安装淘宝镜像npminstall-gcnpm--registry=https://registry.npm.taobao.org安装webpackcnpminstallwebpack-g安装vue脚手架npminstallvue-cli-gcnpm和npm安装vue-cli有报错在硬盘上找一个文件夹放工程用的，在终端中进入该目录Maccd目录... 查看详情

自动化测试cypress(代码片段)

1Cypress介绍赛普拉斯是为现代网络构建的下一代前端测试工具。我们解决了开发人员和质量检查工程师在测试现代应用程序时面临的主要痛点。（1）cypress的官网www.cypress.io/如下如：  （2）点击DOCS进入API如下图： 2cypre... 查看详情

物联网服务nodejs-5天学习第一天篇②——安装nodejs环境以及vscode开发工具(代码片段)

【NodeJs-5天学习】第一天篇②——安装环境以及开发工具1、Node.js环境安装1.1下载安装文件1.2安装步骤1.3常规配置，主要是NPM1.3.1查看配置1.3.2配置国内下载镜像1.3.3尝试下载安装包1.4NPM使用介绍1.4.1查看当前npm版本——npm-v、np... 查看详情

vue学习笔记01：准备开发与调试环境

文章目录一、安装Vue.js（一）使用独立版本1、开发版本2、生产版本3、案例演示（二）使用CDN方式1、采用StaticfileCDN2、案例演示（三）使用NPM方式1、安装Node.js和NPM2、利用NPM安装Vue一、安装Vue.js（一... 查看详情

mac学习vue之环境搭建(代码片段)

1,安装node.js&vsCode  官网下载安装node.js2,搭建vue环境 安装淘宝镜像sudonominstall-gcpm--registry=https://registry.npm.taobao.org--vervose搭建cli脚手架cpminstall-g@vue/cli1，发现报错，权限问题：解决办法，https://www.liangzl.com... 查看详情

为啥通过 cypress-firebase npm 模块登录时 firebase 未定义？

】为啥通过cypress-firebasenpm模块登录时firebase未定义？【英文标题】：whyfirebasegetsundefinedwhileloginthroughcypress-firebasenpmmodule?为什么通过cypress-firebasenpm模块登录时firebase未定义？【发布时间】：2021-11-1110:42:55【问题描述】：我正在使... 查看详情

text在npm_modules中安装cypress一次(代码片段)

查看详情

vue3学习笔记

一、搭建工作环境环境1、从node.js官网下载相应版本进行安装即可https://nodejs.org/zh-cn/download/，安装完成后在命令行输入node-v如果可以查询到版本号，说明安装成功。2、node自带npm包管理工具，在命令行输入npm-v如果查询到版本号... 查看详情

pythonpytorch开发环境搭建（windows和ubuntu）(代码片段)

 PythonPytorch开发环境搭建（Windows和Ubuntu）目录 PythonPytorch开发环境搭建（Windows和Ubuntu）1.安装cudacudnn(1)Windows安装方法(2)Ubuntu18.04安装方法2.安装Python(推荐使用Anaconda)(1)Windows安装方法(2)Ubuntu18.04安装方法3.Pytorch安装... 查看详情

学习笔记ionic学习之环境搭建

初学ionic,后面会把学习的点滴和踩到坑全部记录下来1.环境安装node.js官网地址：https://nodejs.org/en/下载安装包安装。自己记住自己的安装路径哦安装完成后我们测试一下方法运行-cmd 在命令窗口输入node-v npm-v 这样说明... 查看详情