为解决上节所述问题，我们可以使用端到端的集成测试，但其同样有缺陷。考虑消息列表页，其可以通过分页浏览多个消息。我们需要测试下列方面：

运行这些测试之前，我们要确保我们的数据库已经包含正确的消息数据了。这有导致了一系列其它挑战。

这些挑战并不意味着我们是要禁止所有的端到端测试，而是，通过重构复杂的测试，使用执行更快，更可靠，并且没有边际效应的模拟服务，我们能够减少端到端测试的次数。之后我们可以实施少数几次真正的端到端集成测试，只用来验证简单的工作流以确保多个页面协同工作正常。

那么如何达到既能测试页面交互又能保持良好的测试性能呢？答案是：“把MockMvc和HtmlUnit集成起来”。

有多种方式可集成MockMvc 和HtmlUnit：

首先，你要将依赖 net.sourceforge.htmlunit:htmlunit包含进来。为了在Apache HttpComponents4.5+上使用，你的HtmlUnit版本至少要2.18及以上。

使用 MockMvcWebClientBuilder ，可以很容易的创建一个集成了 MockMvc  的HtmlUnit  WebClient 对象，如下所示：

@Autowired
WebApplicationContext context;WebClient webClient;@Before
public void setup() {webClient = MockMvcWebClientBuilder.webAppContextSetup(context).build();
}

	This is a simple example of using MockMvcWebClientBuilder. For advanced usage see the section called “Advanced MockMvcWebClientBuilder”

上述代码可以确保任何指向 localhost 的URL会定向到 MockMvc 实例来处理，而不会发生真实的HTTP连接。任何其它请求还是使用真实网络连接，与普通浏览器一样。这样，即使使用了CDN，测试起来也很简单。

现在，我们可以如使用普通浏览器一样使用HtmlUnit，但不需要部署应用到服务器。例如，我们可以用如下代码，请求创建创新消息的视图：

HtmlPage createMsgFormPage = webClient.getPage("http://localhost/messages/form");

	The default context path is "". Alternatively, we can specify the context path as illustrated in the section called “Advanced MockMvcWebClientBuilder”.

一旦获得 HtmlPage， HtmlPage的引用，我们就可以填充表单然后提交，就可以创建一条消息。

HtmlForm form = createMsgFormPage.getHtmlElementById("messageForm");
HtmlTextInput summaryInput = createMsgFormPage.getHtmlElementById("summary");
summaryInput.setValueAttribute("Spring Rocks");
HtmlTextArea textInput = createMsgFormPage.getHtmlElementById("text");
textInput.setText("In case you didn't know, Spring Rocks!");
HtmlSubmitInput submit = form.getOneHtmlElementByAttribute("input", "type", "submit");
HtmlPage newMessagePage = submit.click();

最后，我们可以检验新的消息是否创建成功。下面的断言使用了AssertJ 库。

assertThat(newMessagePage.getUrl().toString()).endsWith("/messages/123");
String id = newMessagePage.getHtmlElementById("id").getTextContent();
assertThat(id).isEqualTo("123");
String summary = newMessagePage.getHtmlElementById("summary").getTextContent();
assertThat(summary).isEqualTo("Spring Rocks");
String text = newMessagePage.getHtmlElementById("text").getTextContent();
assertThat(text).isEqualTo("In case you didn't know, Spring Rocks!");

这样做会在血多方面提升我们的MockMvc测试。首先，我们不需要再先显式验证表单然后才能创建请求，而且这个请求只是看起来和表单请求一样而已。现在我们只需要请求表单，填充表单，然后提交，显著减少了额外工作。

另一个重要因素是，HtmlUnit使用Mozilla Rhino engine来校验Javascript，这意味着我们也可以测试页面包含的Javascript代码。.

更多HtmlUnit的使用方法请参看HtmlUnit参考文档。

在前面的例子中，我们尽可能用最简单的方法使用 MockMvcWebClientBuilder 创建一个 WebClient ，基于Spring TestContext框架加载的 WebApplicationContext。下面重复这个方法：

@Autowired
WebApplicationContext context;WebClient webClient;@Before
public void setup() {webClient = MockMvcWebClientBuilder.webAppContextSetup(context).build();
}

我们还可以指定更多配置选项。

WebClient webClient;@Before
public void setup() {webClient = MockMvcWebClientBuilder// demonstrates applying a MockMvcConfigurer (Spring Security).webAppContextSetup(context, springSecurity())// for illustration only - defaults to "".contextPath("")// By default MockMvc is used for localhost only;// the following will use MockMvc for example.com and example.org as well.useMockMvcForHosts("example.com","example.org").build();
}

作为替代，我们也可使用相同的启动过程，通过配置一个独立的 MockMvc 实例，并且应用到 MockMvcWebClientBuilder 中，如下：

MockMvc mockMvc = MockMvcBuilders.webAppContextSetup(context).apply(springSecurity()).build();webClient = MockMvcWebClientBuilder.mockMvcSetup(mockMvc)// for illustration only - defaults to "".contextPath("")// By default MockMvc is used for localhost only;// the following will use MockMvc for example.com and example.org as well.useMockMvcForHosts("example.com","example.org").build();

配置起来是比较冗长的，但是用 MockMvc 实例创建出 WebClient 之后，我们就拥有了 MockMvc 的全部能力。

	For additional information on creating a MockMvc instance refer to the section called “Setup Options”.

我们已经使用了HtmlUnit 和 MockMvc，为什么还要去使用 WebDriver呢？这是因为 WebDriver提供了一套非常优雅的API，使我们能够很容易的组织代码。为了明白这点，我们来看个例子。

	Despite being a part of Selenium, WebDriver does not require a Selenium Server to run your tests.

假如我们现在需要确认消息已经被正确的创建，测试的过程包括找到HTML表单的input元素，填充，然后编写多个断言。

这种方法会导致数不胜数的，彼此独立的测试，因为我们也要测试出错情况。例如，要确认如果只是填充表单的一部分的话，会抛出错误，而填充整个表单，则新创建的表单稍后会显示出来。

HtmlTextInput summaryInput = currentPage.getHtmlElementById("summary");
summaryInput.setValueAttribute(summary);

假如将 id 设为"smmry"会发生什么？这会迫使我们修改所有测试方法，来适应这次更改。这违反了DRY原则，因此，我们应该将这些相同的代码提取到一个方法中。

public HtmlPage createMessage(HtmlPage currentPage, String summary, String text) {setSummary(currentPage, summary);// ...
}public void setSummary(HtmlPage currentPage, String summary) {HtmlTextInput summaryInput = currentPage.getHtmlElementById("summary");summaryInput.setValueAttribute(summary);
}

这就保证我们在改变UI的时候无需更新所有的测试方法。

还可再进一步的，把这些代码逻辑放入当前网页的 HtmlPage 对象里去。

public class CreateMessagePage {final HtmlPage currentPage;final HtmlTextInput summaryInput;final HtmlSubmitInput submit;public CreateMessagePage(HtmlPage currentPage) {this.currentPage = currentPage;this.summaryInput = currentPage.getHtmlElementById("summary");this.submit = currentPage.getHtmlElementById("submit");}public <T> T createMessage(String summary, String text) throws Exception {setSummary(summary);HtmlPage result = submit.click();boolean error = CreateMessagePage.at(result);return (T) (error ? new CreateMessagePage(result) : new ViewMessagePage(result));}public void setSummary(String summary) throws Exception {summaryInput.setValueAttribute(summary);}public static boolean at(HtmlPage page) {return "Create Message".equals(page.getTitleText());}
}

最初，这个模式被熟知为“页面对象模式”。我们可以在使用HtmlUnit框架时使用该模式，然而WebDriver框架提供了一些工具，使得该模式更容易编写实现。下一节我们将探讨该模式。

要在Spring MVC测试框架里使用WebDriver框架，需先加入依赖org.seleniumhq.selenium:selenium-htmlunit-driver.到项目中。

我们可以很容易的使用 MockMvcHtmlUnitDriverBuilder 集成 WebDriver 和 MockMvc ，代码如下：

@Autowired
WebApplicationContext context;WebDriver driver;@Before
public void setup() {driver = MockMvcHtmlUnitDriverBuilder.webAppContextSetup(context).build();
}

	This is a simple example of using MockMvcHtmlUnitDriverBuilder. For more advanced usage, refer to the section called “Advanced MockMvcHtmlUnitDriverBuilder”

上述代码可以确保任何指向 localhost 的URL会定向到 MockMvc 实例来处理，而不会发生真实的HTTP连接。任何其它请求还是使用真实网络连接，与普通浏览器一样。这样，即使使用了CDN，测试起来也很简单。

现在，我们可以如使用普通浏览器一样使用WebDriver，但不需要部署应用到服务器。例如，我们可以用如下代码，请求创建创新消息的视图：

CreateMessagePage page = CreateMessagePage.to(driver);

我们可以填充表单然后提交以创建一条新的消息。

ViewMessagePage viewMessagePage =page.createMessage(ViewMessagePage.class, expectedSummary, expectedText);

这个测试使用了页面对象模式，改进了之前使用HtmlUnit的测试方法。正如在“为何要使用WebDriver 与MockMvc集成”章节里提到的，我们可以在集成HtmlUnit框架后使用页面对象模式，但在WebDriver里使用将会更容易。下面请看新的 CreateMessagePage 类的实现：

public class CreateMessagePageextends AbstractPage { private WebElement summary;private WebElement text;@FindBy(css = "input[type=submit]")private WebElement submit;public CreateMessagePage(WebDriver driver) {super(driver);}public <T> T createMessage(Class<T> resultPage, String summary, String details) {this.summary.sendKeys(summary);this.text.sendKeys(details);this.submit.click();return PageFactory.initElements(driver, resultPage);}public static CreateMessagePage to(WebDriver driver) {driver.get("http://localhost:9990/mail/messages/form");return PageFactory.initElements(driver, CreateMessagePage.class);}
}

最后，我们可以检验新消息已经创建成功。下面的断言使用了FEST assertion库。

assertThat(viewMessagePage.getMessage()).isEqualTo(expectedMessage);
assertThat(viewMessagePage.getSuccess()).isEqualTo("Successfully created a new message");

可以看见， ViewMessagePage 实例允许我们和自定义域模型打交道。例如，它公开了返回 Message 对象的方法。

public Message getMessage() throws ParseException {Message message = new Message();message.setId(getId());message.setCreated(getCreated());message.setSummary(getSummary());message.setText(getText());return message;
}

然后我们就可以在断言中使用该域对象。

@After
public void destroy() {if (driver != null) {driver.close();}
}

更过使用WebDriver框架的信息，请参看“WebDriver参考文档”。

在前面的例子中，我们尽可能用最简单的方法使用 MockMvcHtmlUnitDriverBuilder ：创建一个 WebDriver 对象，基于Spring TestContext框架加载的 WebApplicationContext。下面重复这个方法：

@Autowired
WebApplicationContext context;WebDriver driver;@Before
public void setup() {driver = MockMvcHtmlUnitDriverBuilder.webAppContextSetup(context).build();
}

我们还可以指定更多配置选项。

WebDriver driver;@Before
public void setup() {driver = MockMvcHtmlUnitDriverBuilder// demonstrates applying a MockMvcConfigurer (Spring Security).webAppContextSetup(context, springSecurity())// for illustration only - defaults to "".contextPath("")// By default MockMvc is used for localhost only;// the following will use MockMvc for example.com and example.org as well.useMockMvcForHosts("example.com","example.org").build();
}

作为替代，我们也可使用相同的启动过程，通过配置一个独立的 MockMvc 实例，并且应用到 MockMvcHtmlUnitDriverBuilder 中，如下：

MockMvc mockMvc = MockMvcBuilders.webAppContextSetup(context).apply(springSecurity()).build();driver = MockMvcHtmlUnitDriverBuilder.mockMvcSetup(mockMvc)// for illustration only - defaults to "".contextPath("")// By default MockMvc is used for localhost only;// the following will use MockMvc for example.com and example.org as well.useMockMvcForHosts("example.com","example.org").build();

配置起来是比较冗长的，但是用 MockMvc 实例创建出 WebDriver 之后，我们就拥有了 MockMvc 的全部能力。

	For additional information on creating a MockMvc instance refer to the section called “Setup Options”.

Geb框架是有WebDriver作为后盾的，因此它的优点和WebDriver是一样的。Geb框架处理掉了样板代码，使得测试更简洁，更简单。

通过如下使用了 MockMvc 的 WebDriver 对象，我们可以很容易的实例化一个Geb 框架的  Browser 对象。

def setup() {browser.driver = MockMvcHtmlUnitDriverBuilder.webAppContextSetup(context).build()
}

	This is a simple example of using MockMvcHtmlUnitDriverBuilder. For more advanced usage, refer to the section called “Advanced MockMvcHtmlUnitDriverBuilder”

上述代码可以确保任何指向 localhost 的URL会定向到 MockMvc 实例来处理，而不会发生真实的HTTP连接。任何其它请求还是使用真实网络连接，与普通浏览器一样。这样，即使使用了CDN，测试起来也很简单。

现在，我们可以如使用普通浏览器一样使用Geb，但不需要部署应用到服务器。例如，我们可以用如下代码，请求创建创新消息的视图：

to CreateMessagePage

我们可以填充表单然后提交以创建一条新的消息。

when:
form.summary = expectedSummary
form.text = expectedMessage
submit.click(ViewMessagePage)

任何对不存在的方法的调用或对不存在的属性获取、引用，都会转发给当前页面对象。这可以减少很多存在于直接使用WebDriver时的样板代码。

class CreateMessagePage extends Page {static url = 'messages/form'static at = { assert title == 'Messages : Create'; true }static content =  {submit { $('input[type=submit]') }form { $('form') }errors(required:false) { $('label.error, .alert-error')?.text() }}
}

你首先要注意的是， CreateMessagePage 类继承自 Page。我们不会详述 Page类的细节，但总的来说，它包含了所有页面的公共方法。其次，我们定义了一个访问该页面的URL,所以我们可以通过如下方式找到页面。

to CreateMessagePage

我们还定义了 at 代码块，它可以判断我们当前页面是否是某个指定的页面。假如我们访问的是正确的页面，它就会返回 true 。这也是为何我们可以在下面使用断言来断言我们是否访问了正确的页面。

then:
at CreateMessagePage
errors.contains('This field is required.')

	We use an assertion in the closure, so that we can determine where things went wrong if we were at the wrong page.

然后我们创建一个 content 代码块，用来指定页面内所有感兴趣的区域。我们可以使用jQuery-ish Navigator API 来选择我们感兴趣的内容。

then:
at ViewMessagePage
success == 'Successfully created a new message'
id
date
summary == expectedSummary
message == expectedMessage

更多关于如何最大化的使用Geb，请参考Geb用户手册一书。