Network emulation for Chrome

cypress-io · Apr 3, 2020 · f5e4a5a · f5e4a5a
1 parent 3b65143
commit f5e4a5a
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 0 deletions.
diff --git a/packages/driver/src/cy/commands/network.js b/packages/driver/src/cy/commands/network.js
@@ -0,0 +1,20 @@
+module.exports = (Commands, Cypress) => {
+ Commands.addAll({
+ network: (options = {}) => {
+ Cypress.automation('remote:debugger:protocol', {
+ command: 'Network.enable',
+ })
+
+ Cypress.automation('remote:debugger:protocol', {
+ command: 'Network.emulateNetworkConditions',
+ params: {
+ offline: options.offline,
+ 'latency': 0,
+ 'downloadThroughput': 0,
+ 'uploadThroughput': 0,
+ 'connectionType': 'none',
+ },
+ })
+ },
+ })
+}
diff --git a/packages/driver/src/cypress/commands.coffee b/packages/driver/src/cypress/commands.coffee
@@ -27,6 +27,7 @@ builtInCommands = [
  require("../cy/commands/local_storage")
  require("../cy/commands/location")
  require("../cy/commands/misc")
+ require("../cy/commands/network")
  require("../cy/commands/popups")
  require("../cy/commands/navigation")
  require("../cy/commands/querying")

diff --git a/packages/driver/test/cypress/fixtures/network.html b/packages/driver/test/cypress/fixtures/network.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Network Fixture</title>
+</head>
+<body>
+<p>
+ We are currently <span id="network-status"></span>.
+</p>
+<script>
+window.addEventListener('offline', function () { document.getElementById('network-status').innerText = 'offline' })
+window.addEventListener('online', function () {document.getElementById('network-status').innerText = 'online' })
+document.getElementById('network-status').innerText = window.navigator.onLine ? 'online' : 'offline'
+</script>
+</body>
+</html>
diff --git a/packages/driver/test/cypress/integration/commands/network_spec.js b/packages/driver/test/cypress/integration/commands/network_spec.js
@@ -0,0 +1,13 @@
+describe('src/cy/commands/network', () => {
+ before(() => {
+ cy.visit('/fixtures/network.html')
+ })
+
+ it('switches between offline and online', () => {
+ cy.contains('We are currently online.')
+ cy.network({ offline: true })
+ cy.contains('We are currently offline.')
+ cy.network({ offline: false })
+ cy.contains('We are currently online.')
+ })
+})