Reinstate and skip Dashboard and Visualize tests (#15687) (#15698)

* Reinstate and skip flaky Dashboard view edit tests.
* Reinstate and skip flaky Visualize gauge chart tests.

style_guides/testing_style_guide.md

@@ -0,0 +1,32 @@
+# Testing style guide
+
+## Principles
+
+* A good test helps you identify what broke and how so you can fix it quickly. A bad test tells you something is broken but wastes your time trying to figure out what and how.
+* Tests add time to the development cycle so we should write as few tests as possible, but no fewer.
+* **Unit tests** should cover 70% of our needs. They'll ensure our fundamentals are sound.
+* **Integrations tests** should cover 20% of our needs. They'll ensure our units work well together.
+* **End-to-end tests** should cover 10% of our needs. They'll ensure our primary user flows are intact and alleviate the burden of manual testing from our QA engineers.
+
+## Anti-patterns
+
+### Too many assertions in a single test
+
+A test's usability goes down as the number of assertions it contains goes up. The more assertions you make, the less clear the purpose of the test.
+
+Instead of doing this, try one of these alternatives:
+
+1. Try breaking up the test into multiple tests with individual assertions. This clarifies what you're testing.
+2. Try using Jest snapshots in lieu of multiple assertions about the state of the UI. This makes your test more concise and maps it more clearly to the appearance of the UI.
+
+### Testing concrete details instead of abstractions
+
+Let's say a feature in your UI consists of a form and a submit button. If you want to test that this feature is available, then making an assertion against the form inputs and submit button would be a test of the feature's concrete details. This would be a brittle test that's prone to being broken by changes to the form's design or to the UX of the feature.
+
+A better test would test for the abstract availability of this feature. For example, a `data-test-subj` selector on the container or some other proxy element to ensure the user has access to the feature.
+
+### PageObject method does too much
+
+### PageObject method contains conditional logic
+
+### PageObject is bloated

test/functional/apps/dashboard/_view_edit.js

@@ -57,6 +57,27 @@ export default function ({ getService, getPageObjects }) {
           await PageObjects.dashboard.gotoDashboardEditMode(dashboardName);
         });
 
+        it.skip('when time changed is stored with dashboard', async function () {
+          const originalFromTime = '2015-09-19 06:31:44.000';
+          const originalToTime = '2015-09-19 06:31:44.000';
+          await PageObjects.header.setAbsoluteRange(originalFromTime, originalToTime);
+          await PageObjects.dashboard.saveDashboard(dashboardName, { storeTimeWithDashboard: true });
+          await PageObjects.header.clickToastOK();
+
+          await PageObjects.dashboard.clickEdit();
+          await PageObjects.header.setAbsoluteRange('2013-09-19 06:31:44.000', '2013-09-19 06:31:44.000');
+          await PageObjects.dashboard.clickCancelOutOfEditMode();
+
+          // confirm lose changes
+          await PageObjects.common.clickConfirmOnModal();
+
+          const newFromTime = await PageObjects.header.getFromTime();
+          const newToTime = await PageObjects.header.getToTime();
+
+          expect(newFromTime).to.equal(originalFromTime);
+          expect(newToTime).to.equal(originalToTime);
+        });
+
         it('when the query is edited and applied', async function () {
           const originalQuery = await PageObjects.dashboard.getQuery();
           await PageObjects.dashboard.setQuery(`${originalQuery} and extra stuff`);
@@ -137,6 +158,32 @@ export default function ({ getService, getPageObjects }) {
       });
     });
 
+    describe.skip('and preserves edits on cancel', function () {
+      it('when time changed is stored with dashboard', async function () {
+        await PageObjects.dashboard.gotoDashboardEditMode(dashboardName);
+        const newFromTime = '2015-09-19 06:31:44.000';
+        const newToTime = '2015-09-19 06:31:44.000';
+        await PageObjects.header.setAbsoluteRange('2013-09-19 06:31:44.000', '2013-09-19 06:31:44.000');
+        await PageObjects.dashboard.saveDashboard(dashboardName, true);
+        await PageObjects.header.clickToastOK();
+        await PageObjects.dashboard.clickEdit();
+        await PageObjects.header.setAbsoluteRange(newToTime, newToTime);
+        await PageObjects.dashboard.clickCancelOutOfEditMode();
+
+        await PageObjects.common.clickCancelOnModal();
+        await PageObjects.dashboard.saveDashboard(dashboardName, { storeTimeWithDashboard: true });
+        await PageObjects.header.clickToastOK();
+
+        await PageObjects.dashboard.loadSavedDashboard(dashboardName);
+
+        const fromTime = await PageObjects.header.getFromTime();
+        const toTime = await PageObjects.header.getToTime();
+
+        expect(fromTime).to.equal(newFromTime);
+        expect(toTime).to.equal(newToTime);
+      });
+    });
+
     describe('Does not show lose changes warning', async function () {
       it('when time changed is not stored with dashboard', async function () {
         await PageObjects.dashboard.gotoDashboardEditMode(dashboardName);

test/functional/apps/visualize/_gauge_chart.js

@@ -44,6 +44,56 @@ export default function ({ getService, getPageObjects }) {
         });
       });
 
+      it.skip('should show Split Gauges', function () {
+        const expectedTexts = [ 'win 8', 'win xp', 'win 7', 'ios', 'osx' ];
+        return PageObjects.visualize.clickMetricEditor()
+          .then(function clickBucket() {
+            log.debug('Bucket = Split Group');
+            return PageObjects.visualize.clickBucket('Split Group');
+          })
+          .then(function selectAggregation() {
+            log.debug('Aggregation = Terms');
+            return PageObjects.visualize.selectAggregation('Terms');
+          })
+          .then(function selectField() {
+            log.debug('Field = machine.os.raw');
+            return PageObjects.visualize.selectField('machine.os.raw');
+          })
+          .then(function clickGo() {
+            return PageObjects.visualize.clickGo();
+          })
+          .then(function () {
+            return retry.try(function tryingForTime() {
+              return PageObjects.visualize.getGaugeValue()
+                .then(function (metricValue) {
+                  expect(expectedTexts).to.eql(metricValue);
+                });
+            });
+          });
+      });
+
+      it.skip('should show correct values for fields with fieldFormatters', async function () {
+        const expectedTexts = [ '2,904\nwin 8: Count', '5.528KB' ];
+
+
+        await PageObjects.visualize.clickMetricEditor();
+        await PageObjects.visualize.clickBucket('Split Group');
+        await PageObjects.visualize.selectAggregation('Terms');
+        await PageObjects.visualize.selectField('machine.os.raw');
+        await PageObjects.visualize.setSize('1');
+        await PageObjects.visualize.clickAddMetric();
+        await PageObjects.visualize.clickBucket('Metric');
+        await PageObjects.visualize.selectAggregation('Average', 'metrics');
+        await PageObjects.visualize.selectField('bytes', 'metrics');
+        await PageObjects.visualize.clickGo();
+
+        return retry.try(function tryingForTime() {
+          return PageObjects.visualize.getGaugeValue()
+            .then(function (metricValue) {
+              expect(expectedTexts).to.eql(metricValue);
+            });
+        });
+      });
     });
   });
 }