Add tests for viz legend contents

e2e_tests/integration/viz.zpec.js

@@ -0,0 +1,49 @@
+/*
+ * Copyright (c) 2002-2018 "Neo4j, Inc"
+ * Network Engine for Objects in Lund AB [http://neotechnology.com]
+ *
+ * This file is part of Neo4j.
+ *
+ * Neo4j is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+/* global Cypress, cy, test, expect, before */
+
+describe('Viz rendering', () => {
+  before(function () {
+    cy.visit(Cypress.config.url)
+      .title()
+      .should('include', 'Neo4j Browser')
+  })
+  it('can connect', () => {
+    const password = Cypress.config.password
+    cy.connect(
+      'neo4j',
+      password
+    )
+  })
+  it('shows legend with rel types + node labels on first render', () => {
+    cy.executeCommand(':clear')
+    cy.executeCommand(
+      `CREATE (a:TestLabel)-[:CONNECTS]->(b:TestLabel) RETURN a, b`
+    )
+    cy.get(`[data-test-id="viz-legend-reltypes"]`, { timeout: 5000 }).contains(
+      'CONNECTS'
+    )
+    cy.get(`[data-test-id="viz-legend-labels"]`, { timeout: 5000 }).contains(
+      'TestLabel'
+    )
+    cy.executeCommand(`MATCH (a:TestLabel) DETACH DELETE a`)
+  })
+})

src/browser/modules/D3Visualization/components/Legend.jsx

@@ -67,7 +67,7 @@ export class LegendComponent extends Component {
           color: styleForItem.get('text-color-internal')
         }
         return (
-          <StyledLegendInlineListItem key={i}>
+          <StyledLegendInlineListItem key={i} data-test-id='viz-legend-labels'>
             <StyledLegendContents className='contents'>
               <StyledLabelToken
                 onClick={onClick}
@@ -125,7 +125,10 @@ export class LegendComponent extends Component {
           color: styleForItem.get('text-color-internal')
         }
         return (
-          <StyledLegendInlineListItem key={i}>
+          <StyledLegendInlineListItem
+            key={i}
+            data-test-id='viz-legend-reltypes'
+          >
             <StyledLegendContents className='contents'>
               <StyledTokenRelationshipType
                 onClick={onClick}