草庐IT

WEB自动化-14-Cypress 其他

Surpassme 2023-03-28 原文

14 其他

14.1 IDE集成

    有非常多的三方插件都支持集成IDE中，从而提高工作效率，我们以Visual Studio Code为例讲解。主要插件如下所示：

  • Cypress Fixture-IntelliSense

    Cypress Fixture-IntelliSense是一款支持在cy.fixture()、cy.route()等时的一款智能提示插件。插件地址：https://marketplace.visualstudio.com/items?itemName=JosefBiehler.cypress-fixture-intellisense

  • Cypress Helper

    Cypress Helper 是一款提供各类帮助和命令的插件，例如提供了转到定义、查找未使用命令等。插件地址：https://marketplace.visualstudio.com/items?itemName=Shelex.vscode-cy-helper

  • Cypress Snippets

    Cypress Snippets 是一款提供各种代码片断和缩写提示的插件，非常好用。插件地址：https://marketplace.visualstudio.com/items?itemName=CliffSu.cypress-snippets

    Mocha代码片断，对应的缩写如下所示：

片断 对应代码
dsb describe('', () => {});
ctx context('', () => {});
spy specify('', () => {});
it it('', () => {});
bf before('', () => {});
bfe beforeEach('', () => {});
af after('', () => {});
afe afterEach('', () => {});

    Cypress 代码片断，对应的缩写如下所示：

片断 对应代码
cyvt cy.visit('');
cygt cy.get('');
cyfd cy.get('').find('');
cyft cy.get('').first('');
cyte cy.get('').type('');
cycs cy.contains('');
cyck cy.get('').click();
cywt cy.wait('');
cylg cy.log('');
cype cy.pause();
cydg cy.debug();
cyst cy.screenshot('');
cyvp cy.viewport();
  • Open Cypress

    Open Cypress可以直接在Visual Studio Code中快速打开Cypress

14.2 添加代码智能提示

    Cypress有很多命令，单凭记忆肯定不行的。但Cypress也提供了智能提示功能，配置如下所示：

  • 每个测试用例前添加一行引用，如下所示：
/// <reference types="cypress" />

    如果有自定义命令，则配置如下所示：

// 比如添加了自定义命令 createDefaultTodos
/// <reference types="../support" />
  • 添加全局配置文件

    添加一个全局的配置文件后，则每个测试文件就不需要每次都要添加一个引用，操作步骤如下所示：

1、在工程根目录（cypress.json所在目录）创建一个文件jsconfig.json
2、在jsconfig.json添加以下内容

{
	"include": [
		"./node_modules/cypress",
		"cypress/**/*.js"
	]
}
  • 当前文件夹添加配置

1、在当前文件夹中创建一个文件tsconfig.json
2、在tsconfig.json添加以下内容

{
  "compilerOptions": {
    "allowJs": true,
    "types": ["cypress"]
  },
  "include": ["**/*.*"]
}

14.3 添加配置文件智能提示

    在编辑文件（例如cypress.json）时，如果没有智能提示，则只能一个个输入，还容易出错，而Cypress也是支持在IDE环境，编辑配置文件也做到智能提示。以cypress.json为例，直接在配置文件添加以下内容即可：

"$schema": "https://on.cypress.io/cypress.schema.json",

    添加成功后，重启Visual Studio Code并再次打开编辑即可，示意图如下所示：

原文地址：https://www.jianshu.com/p/f2a681979256

本文同步在微信订阅号上发布，如各位小伙伴们喜欢我的文章，也可以关注我的微信订阅号：woaitest，或扫描下面的二维码添加关注：

CypressWEBtdstrongfont软件测试

有关WEB自动化-14-Cypress 其他的更多相关文章

  1. ruby-on-rails - 使用 Ruby on Rails 进行自动化测试 - 最佳实践 - 2

    很好奇，就使用ruby​​onrails自动化单元测试而言，你们正在做什么？您是否创建了一个脚本来在cron中运行rake作业并将结果邮寄给您？git中的预提交Hook？只是手动调用？我完全理解测试，但想知道在错误发生之前捕获错误的最佳实践是什么。让我们理所当然地认为测试本身是完美无缺的，并且可以正常工作。下一步是什么以确保他们在正确的时间将可能有害的结果传达给您？ 最佳答案 不确定您到底想听什么，但是有几个级别的自动代码库控制:在处理某项功能时，您可以使用类似autotest的内容获得关于哪些有效，哪些无效的即时反馈。要确保您的提

  2. ruby - 其他文件中的 Rake 任务 - 2

    我试图在一个项目中使用rake，如果我把所有东西都放到Rakefile中，它会很大并且很难读取/找到东西，所以我试着将每个命名空间放在lib/rake中它自己的文件中，我添加了这个到我的rake文件的顶部:Dir['#{File.dirname(__FILE__)}/lib/rake/*.rake'].map{|f|requiref}它加载文件没问题，但没有任务。我现在只有一个.rake文件作为测试，名为“servers.rake”，它看起来像这样:namespace:serverdotask:testdoputs"test"endend所以当我运行rakeserver:testid时

  3. ruby - 如何将脚本文件的末尾读取为数据文件(Perl 或任何其他语言) - 2

    我正在寻找执行以下操作的正确语法(在Perl、Shell或Ruby中):#variabletoaccessthedatalinesappendedasafileEND_OF_SCRIPT_MARKERrawdatastartshereanditcontinues. 最佳答案 Perl用__DATA__做这个:#!/usr/bin/perlusestrict;usewarnings;while(){print;}__DATA__Texttoprintgoeshere 关于ruby-如何将脚

  4. ruby - RuntimeError(自动加载常量 Apps 多线程时检测到循环依赖 - 2

    我收到这个错误:RuntimeError(自动加载常量Apps时检测到循环依赖当我使用多线程时。下面是我的代码。为什么会这样？我尝试多线程的原因是因为我正在编写一个HTML抓取应用程序。对Nokogiri::HTML(open())的调用是一个同步阻塞调用，需要1秒才能返回，我有100,000多个页面要访问，所以我试图运行多个线程来解决这个问题。有更好的方法吗？classToolsController0)app.website=array.join(',')putsapp.websiteelseapp.website="NONE"endapp.saveapps=Apps.order("

  5. ruby - 调用其他方法的 TDD 方法的正确方法 - 2

    我需要一些关于TDD概念的帮助。假设我有以下代码defexecute(command)casecommandwhen"c"create_new_characterwhen"i"display_inventoryendenddefcreate_new_character#dostufftocreatenewcharacterenddefdisplay_inventory#dostufftodisplayinventoryend现在我不确定要为什么编写单元测试。如果我为execute方法编写单元测试，那不是几乎涵盖了我对create_new_character和display_invent

  6. java - 我的模型类或其他类中应该有逻辑吗 - 2

    我只想对我一直在思考的这个问题有其他意见，例如我有classuser_controller和classuserclassUserattr_accessor:name,:usernameendclassUserController//dosomethingaboutanythingaboutusersend问题是我的User类中是否应该有逻辑user=User.newuser.do_something(user1)oritshouldbeuser_controller=UserController.newuser_controller.do_something(user1,user2)我

  7. ruby-on-rails - 从应用程序中自定义文件夹内的命名空间自动加载 - 2

    我们目前正在为ROR3.2开发自定义cms引擎。在这个过程中，我们希望成为我们的rails应用程序中的一等公民的几个类类型起源，这意味着它们应该驻留在应用程序的app文件夹下，它是插件。目前我们有以下类型:数据源数据类型查看我在app文件夹下创建了多个目录来保存这些:应用/数据源应用/数据类型应用/View更多类型将随之而来，我有点担心应用程序文件夹被这么多目录污染。因此，我想将它们移动到一个子目录/模块中，该子目录/模块包含cms定义的所有类型。所有类都应位于MyCms命名空间内，目录布局应如下所示:应用程序/my_cms/data_source应用程序/my_cms/data_ty

  8. ruby-on-rails - 有没有一种工具可以在编码时自动保存对文件的增量更改？ - 2

    我最喜欢的Google文档功能之一是它会在我工作时不断自动保存我的文档版本。这意味着即使我在进行关键更改之前忘记在某个点进行保存，也很有可能会自动创建一个保存点。至少，我可以将文档恢复到错误更改之前的状态，并从该点继续工作。对于在MacOS(或UNIX)上运行的Ruby编码器，是否有具有等效功能的工具？例如，一个工具会每隔几分钟自动将Gitcheckin我的本地存储库以获取我正在处理的文件。也许我有点偏执，但这点小保险可以让我在日常工作中安心。 最佳答案 虚拟机有些人可能讨厌我对此的回应，但我在编码时经常使用VIM，它具有自动保存功

  9. ruby - 如何配置 Ruby Mechanize 代理以通过 Charles Web 代理工作？ - 2

    我正在使用Ruby/Mechanize编写一个“自动填写表格”应用程序。它几乎可以工作。我可以使用精彩CharlesWeb代理以查看服务器和我的Firefox浏览器之间的交换。现在我想使用Charles查看服务器和我的应用程序之间的交换。Charles在端口8888上代理。假设服务器位于https://my.host.com。.一件不起作用的事情是:@agent||=Mechanize.newdo|agent|agent.set_proxy("my.host.com",8888)end这会导致Net::HTTP::Persistent::Error:...lib/net/http/pe

  10. ruby-on-rails - 无法安装 mysql2 0.3.14 gem - 2

    我看到其他人也遇到过类似的问题，但没有一个解决方案对我有用。0.3.14gem与其他gem文件一起存在。我已经完全按照此处指示完成了所有操作:https://github.com/brianmario/mysql2.我仍然得到以下信息。我不知道为什么安装程序指示它找不到include目录，因为我已经检查过它存在。thread.h文件存在，但不在ruby​​目录中。相反，它在这里:C:\RailsInstaller\DevKit\lib\perl5\5.8\msys\CORE\我正在运行Windows7并尝试在Aptana3中构建我的Rails项目。我的Ruby是1.9.3。$gemin

随机推荐