JavaScript是否与严格的页面对象模式兼容？

Question

我使用Java和页面对象模式构建了各种测试自动化框架(https://code.google.com/p/selenium/wiki/PageObjects)，其中我发现的两个主要好处是：

1) 有了页面实例后，您可以看到可用的方法(例如键入homepage.将显示所有可以从homepage调用的操作/方法)

2) 因为导航方法(例如goToHomepage())返回随后页面的实例(homepage)，所以通过编写代码并查看其带你去哪里，您可以通过测试简单地导航。

例如：

WelcomePage welcomePage = loginPage.loginWithValidUser(validUser);
PaymentsPage paymentsPage = welcomePage.goToPaymentsPage();

这些好处在Java中运作得非常完美，因为IDE知道对象的类型（或页面）。

然而，在JavaScript（动态类型语言）中，对象类型在任何时候都不是固定的，并且通常对IDE来说含糊不清。因此，我无法看到如何在使用JavaScript构建的自动化套件上实现这些好处（例如通过使用Cucumber）。

有人能向我展示如何使用页面对象模式来使用JavaScript获得这些好处吗？

- Charlie S

---

我不熟悉这个模式，但是问题本身似乎对于这个网站来说可能太宽泛了...一些JS IDE非常擅长捕捉对象应该具有的属性。此外，如果您不介意额外的编译步骤，TypeScript也可以是一个选项。 - Gerrit0

你是在问这个问题对于所有编程语言吗 :) ? - Tom

不需要...只是JavaScript和Ruby :-) - Charlie S

Answer 1

根据Gerrit0的评论和进一步调查，似乎使用TypeScript（这是JavaScript的静态类型版本）是实现此目的的好方法:

https://en.wikipedia.org/wiki/TypeScript

- Charlie S

---

请注意，Typescript 必须编译成 JavaScript，而 JavaScript 是弱类型语言。Typescript 提供编译时反馈，但没有运行时保证。 - shadymoses

Answer 2

我对这些模式不是很了解，但我会给出一些细节，也许可以帮助你。http://www.guru99.com/page-object-model-pom-page-factory-in-selenium-ultimate-guide.html

http://www.assertselenium.com/automation-design-practices/page-object-pattern/

似乎实现这一点的一个好方法是使用 TypeScript（它是 JavaScript 的静态类型版本）：

https://en.wikipedia.org/wiki/TypeScript

- bob marti

Answer 3

如果你使用Jetbrains的产品，比如IntelliJ IDEA, 它会为你提供代码补全和正确的导航。在Javascript的世界里，页面对象也是一个众所周知的模式。AngularJs 在它自己的端到端测试框架中也提供了这个模式（http://www.protractortest.org/#/page-objects）。个人而言，我使用IIFE来实现页面对象，而IntelliJ则负责剩下的工作。如果不符合你的需求，你仍然可以选择TypeScript，并将其转换成JavaScript。

- akos.bordas

---

IntelliJ是用于Java的。我曾经使用Jetbrains IDEA来编写JavaScript（称为WebStorm），但很遗憾，这并不起作用，因为页面对象类型是未知的。 - Charlie S