From 0446cb13462d1f65eb5841700790cb4b372e3786 Mon Sep 17 00:00:00 2001
From: Jonathan Bouzekri <jonathan.bouzekri@gmail.com>
Date: Tue, 8 Aug 2017 16:43:19 +0200
Subject: [PATCH] geoloc e2e tests

---
 src/components/GmaltGeoloc.vue     |  2 +-
 test/e2e/helper.js                 |  2 +-
 test/e2e/specs/GmaltGeoloc.spec.js | 76 ++++++++++++++++++++++++++++++
 test/e2e/specs/GmaltMap.spec.js    |  2 +-
 4 files changed, 79 insertions(+), 3 deletions(-)
 create mode 100644 test/e2e/specs/GmaltGeoloc.spec.js

diff --git a/src/components/GmaltGeoloc.vue b/src/components/GmaltGeoloc.vue
index 3707933..9967a60 100644
--- a/src/components/GmaltGeoloc.vue
+++ b/src/components/GmaltGeoloc.vue
@@ -1,5 +1,5 @@
 <template>
-  <button type="button" class="btn" @click="geolocalize()" :disabled="disabled">
+  <button id="geoloc-button" type="button" class="btn" @click="geolocalize()" :disabled="disabled">
     <i class="fa fa-crosshairs" aria-hidden="true"></i> Use your position
   </button>
 </template>
diff --git a/test/e2e/helper.js b/test/e2e/helper.js
index 0db009e..7ca6047 100644
--- a/test/e2e/helper.js
+++ b/test/e2e/helper.js
@@ -30,7 +30,7 @@ module.exports = {
     browser
       .waitForElementVisible('.vue-map-container .gm-style', 8000)
       .execute(this.loadSinon(`
-        let stubedFetch = sinon.stub(window, 'fetch', function() {           
+        let stubedFetch = sinon.stub(window, 'fetch', function() {
            return Promise.resolve({status: 200, json: function() { return {alt: ${altitude}} }})
         });
 
diff --git a/test/e2e/specs/GmaltGeoloc.spec.js b/test/e2e/specs/GmaltGeoloc.spec.js
new file mode 100644
index 0000000..f45a128
--- /dev/null
+++ b/test/e2e/specs/GmaltGeoloc.spec.js
@@ -0,0 +1,76 @@
+let helper = require('../helper')
+
+module.exports = {
+  'click on geoloc button updates result on success': function (browser) {
+    const devServer = browser.globals.devServerURL
+
+    browser
+      .url(devServer)
+      .waitForElementVisible('.vue-map-container .gm-style', 8000)
+      .execute(helper.loadSinon(`
+        let stubedGeoloc = sinon.stub(navigator.geolocation, 'getCurrentPosition', function(success, error) {
+           success({coords: {latitude: 48.857868, longitude: 2.250452}})
+        });
+        
+        let stubedFetch = sinon.stub(window, 'fetch', function() {
+           return Promise.resolve({status: 200, json: function() { return {alt: 789} }})
+        });
+
+        let sinonLoaded = document.createElement('div')
+        sinonLoaded.style.visibility = 'hidden'
+        sinonLoaded.id = 'sinonLoaded'
+        document.head.appendChild(sinonLoaded)
+      `))
+      .waitForElementPresent('#sinonLoaded', 3000)
+
+    browser
+      .click('#geoloc-button')
+
+    browser
+      .waitForElementPresent('.card .card-item:nth-child(1) strong', 3000)
+      .waitForElementPresent('.card .card-item:nth-child(2) strong', 3000)
+      .waitForElementPresent('.card .card-item:nth-child(3) strong', 3000)
+      .waitForElementPresent('.card .card-item:nth-child(4) strong', 3000)
+
+    browser
+      .assert.value('#form-latitude', '48.857868')
+      .assert.value('#form-longitude', '2.250452')
+      .assert.containsText('.card .card-item:nth-child(1) strong', '48.857868')
+      .assert.containsText('.card .card-item:nth-child(2) strong', '2.250452')
+      .assert.containsText('.card .card-item:nth-child(3) strong', 'Avenue de l\'Hippodrome, 75016 Paris, France')
+      .assert.containsText('.card .card-item:nth-child(4) strong', '789 m')
+      .end()
+  },
+
+  'click on geoloc disable button on error': function (browser) {
+    const devServer = browser.globals.devServerURL
+
+    browser
+      .url(devServer)
+      .waitForElementVisible('.vue-map-container .gm-style', 8000)
+      .execute(helper.loadSinon(`
+        let stubedGeoloc = sinon.stub(navigator.geolocation, 'getCurrentPosition', function(success, error) {
+           error()
+        });
+
+        let sinonLoaded = document.createElement('div')
+        sinonLoaded.style.visibility = 'hidden'
+        sinonLoaded.id = 'sinonLoaded'
+        document.head.appendChild(sinonLoaded)
+      `))
+      .waitForElementPresent('#sinonLoaded', 3000)
+
+    browser
+      .click('#geoloc-button')
+
+    browser
+      .assert.attributeEquals('#geoloc-button', 'disabled', 'true')
+      .assert.value('#form-latitude', '')
+      .assert.value('#form-longitude', '')
+      .assert.containsText('.card .card-item:nth-child(1) .card-item-value span', 'No value')
+      .assert.containsText('.card .card-item:nth-child(2) .card-item-value span', 'No value')
+      .assert.containsText('.card .card-item:nth-child(3) .card-item-value span', 'No value')
+      .assert.containsText('.card .card-item:nth-child(4) .card-item-value span', 'No value')
+      .end()
+  }
+}
diff --git a/test/e2e/specs/GmaltMap.spec.js b/test/e2e/specs/GmaltMap.spec.js
index 0876199..81353af 100644
--- a/test/e2e/specs/GmaltMap.spec.js
+++ b/test/e2e/specs/GmaltMap.spec.js
@@ -33,7 +33,7 @@ module.exports = {
       .setValue('#map-content input[type="text"]', '31 rue de rome Paris')
       .waitForElementVisible('.pac-container .pac-item:first-child', 3000)
       .execute(helper.loadSinon(`
-        let stubedFetch = sinon.stub(window, 'fetch', function() {           
+        let stubedFetch = sinon.stub(window, 'fetch', function() {
            return Promise.resolve({status: 200, json: function() { return {alt: 345} }})
         });