Update alias UI (#2960) (#3188)

* Update alias UI (#2960)

- Fixes #477

* fix reporter fixture name

cli/test/lib/tasks/cache_spec.js

@@ -40,9 +40,12 @@ describe('lib/tasks/cache', () => {
   describe('.clear', () => {
     it('deletes cache folder and everything inside it', () => {
       return cache.clear()
-      .then(() =>
-        fs.pathExistsAsync('/.cache/Cypress')
-        .then((exists) => expect(exists).to.eql(false))
+      .then(() => {
+        return fs.pathExistsAsync('/.cache/Cypress')
+        .then((exists) => {
+          return expect(exists).to.eql(false)
+        })
+      }
       )
     })
   })

packages/driver/src/cy/commands/querying.coffee

@@ -84,7 +84,7 @@ module.exports = (Commands, Cypress, cy, state, config) ->
 
         options._log ?= Cypress.log
           message: selector
-          referencesAlias: aliasObj?.alias
+          referencesAlias: if aliasObj?.alias then {name: aliasObj.alias}
           aliasType: aliasType
           consoleProps: -> consoleProps
 

packages/driver/src/cy/commands/waiting.coffee

@@ -82,13 +82,22 @@ module.exports = (Commands, Cypress, cy, state, config) ->
 
       type = cy.getXhrTypeByAlias(str)
 
+      [ index, num ] = getNumRequests(state, alias)
+
       ## if we have a command then continue to
       ## build up an array of referencesAlias
       ## because wait can reference an array of aliases
       if log
         referencesAlias = log.get("referencesAlias") ? []
         aliases = [].concat(referencesAlias)
-        aliases.push(str)
+
+        if str
+          aliases.push({
+            name: str
+            cardinal: index + 1,
+            ordinal: num
+          })
+
         log.set "referencesAlias", aliases
 
       if command.get("name") isnt "route"
@@ -104,8 +113,6 @@ module.exports = (Commands, Cypress, cy, state, config) ->
       requestTimeout = options.requestTimeout ? timeout
       responseTimeout = options.responseTimeout ? timeout
 
-      [ index, num ] = getNumRequests(state, alias)
-
       waitForRequest = ->
         options = _.omit(options, "_runnableTimeout")
         options.timeout = requestTimeout ? Cypress.config("requestTimeout")
@@ -136,7 +143,7 @@ module.exports = (Commands, Cypress, cy, state, config) ->
 
       if log
         log.set "consoleProps", -> {
-          "Waited For": (log.get("referencesAlias") || []).join(", ")
+          "Waited For": (_.map(log.get("referencesAlias"), 'name') || []).join(", ")
           "Yielded": ret
         }
 

packages/driver/test/cypress/integration/commands/querying_spec.coffee

@@ -739,15 +739,15 @@ describe "src/cy/commands/querying", ->
           .get("@getUsers").then ->
             expect(@lastLog.pick("message", "referencesAlias", "aliasType")).to.deep.eq {
               message: "@getUsers"
-              referencesAlias: "getUsers"
+              referencesAlias: {name: "getUsers"}
               aliasType: "route"
             }
 
       it "logs primitive aliases", (done) ->
         cy.on "log:added", (attrs, log) ->
           if attrs.name is "get"
             expect(log.pick("$el", "numRetries", "referencesAlias", "aliasType")).to.deep.eq {
-              referencesAlias: "f"
+              referencesAlias: {name: "f"}
               aliasType: "primitive"
             }
             done()

packages/driver/test/cypress/integration/commands/waiting_spec.coffee

@@ -770,7 +770,7 @@ describe "src/cy/commands/waiting", ->
           cy.on "fail", (err) =>
             obj = {
               name: "wait"
-              referencesAlias: ["getFoo"]
+              referencesAlias: [{name: 'getFoo', cardinal: 1, ordinal: "1st"}]
               aliasType: "route"
               type: "parent"
               error: err
@@ -847,11 +847,28 @@ describe "src/cy/commands/waiting", ->
             .window().then (win) ->
               xhrGet(win, "/foo")
               xhrGet(win, "/bar")
+              xhrGet(win, "/foo")
               null
-            .wait(["@getFoo", "@getBar"]).then (xhrs) ->
+            .wait(["@getFoo", "@getBar", "@getFoo"]).then (xhrs) ->
               lastLog = @lastLog
 
-              expect(lastLog.get("referencesAlias")).to.deep.eq ["getFoo", "getBar"]
+              expect(lastLog.get("referencesAlias")).to.deep.eq [
+                {
+                  name: "getFoo",
+                  cardinal: 1,
+                  ordinal: '1st'
+                },
+                {
+                  name: "getBar",
+                  cardinal: 1,
+                  ordinal: '1st'
+                },
+                {
+                  name: "getFoo",
+                  cardinal: 2,
+                  ordinal: '2nd'
+                }
+              ]
 
         it "#consoleProps waiting on 1 alias", ->
           cy

packages/driver/test/cypress/integration/commands/window_spec.coffee

@@ -123,7 +123,7 @@ describe "src/cy/commands/window", ->
             expect(@logs[0].get("aliasType")).to.eq("primitive")
 
             expect(@logs[2].get("aliasType")).to.eq("primitive")
-            expect(@logs[2].get("referencesAlias")).to.eq("win")
+            expect(@logs[2].get("referencesAlias").name).to.eq("win")
 
       it "logs obj", ->
         cy.window().then ->
@@ -270,7 +270,7 @@ describe "src/cy/commands/window", ->
             expect(logs[0].get("aliasType")).to.eq("primitive")
 
             expect(logs[2].get("aliasType")).to.eq("primitive")
-            expect(logs[2].get("referencesAlias")).to.eq("doc")
+            expect(logs[2].get("referencesAlias").name).to.eq("doc")
 
       it "logs obj", ->
         cy.document().then ->

packages/reporter/cypress/fixtures/aliases_runnables.json

@@ -0,0 +1,13 @@
+{
+  "id": "r1",
+  "title": "",
+  "root": true,
+  "suites": [],
+  "tests": [
+    {
+      "id": "r3",
+      "title": "test 1",
+      "state": "passed"
+    }
+  ]
+}

packages/reporter/cypress/integration/aliases_spec.coffee

@@ -0,0 +1,222 @@
+{ EventEmitter } = require("events")
+_ = Cypress._
+
+addLog = (runner, log) ->
+  defaultLog = {
+    event: false
+    hookName: "test"
+    id: _.uniqueId('l')
+    instrument: "command"
+    renderProps: {}
+    state: "passed"
+    testId: "r3"
+    type: "parent"
+    url: "http://example.com"
+  }
+
+  runner.emit("reporter:log:add", _.extend(defaultLog, log))
+
+describe "aliases", ->
+  beforeEach ->
+    cy.fixture("aliases_runnables").as("runnables")
+
+    @runner = new EventEmitter()
+
+    cy.visit("cypress/support/index.html").then (win) =>
+      win.render({
+        runner: @runner
+        specPath: "/foo/bar"
+      })
+
+    cy.get(".reporter").then =>
+      @runner.emit("runnables:ready", @runnables)
+      @runner.emit("reporter:start", {})
+
+
+  describe "without duplicates", ->
+    beforeEach ->
+      addLog(@runner, {
+        alias: "getUsers"
+        aliasType: "route"
+        displayName: "xhr stub"
+        event: true
+        name: "xhr"
+        renderProps: {message: "GET --- /users", indicator: "passed"}
+      })
+      addLog(@runner, {
+        aliasType: "route"
+        message: "@getUsers, function(){}"
+        name: "wait"
+        referencesAlias: [{
+          cardinal: 1
+          name: "getUsers"
+          ordinal: "1st"
+        }],
+      })
+
+    it "render without a count", ->
+      cy.contains('.command-number', '1')
+        .parent()
+        .within ->
+          cy.get('.command-alias-count').should('not.exist')
+          cy.contains('.command-alias', '@getUsers')
+            .trigger("mouseover")
+
+      cy.get(".tooltip span").should ($tooltip) ->
+        expect($tooltip).to.contain("Found an alias for: 'getUsers'")
+
+  describe "with consecutive duplicates", ->
+    beforeEach ->
+      addLog(@runner, {
+        alias: "getPosts"
+        aliasType: "route"
+        displayName: "xhr stub"
+        event: true
+        name: "xhr"
+        renderProps: {message: "GET --- /posts", indicator: "passed"}
+      })
+      addLog(@runner, {
+        alias: "getPosts"
+        aliasType: "route"
+        displayName: "xhr stub"
+        event: true
+        name: "xhr"
+        renderProps: {message: "GET --- /posts", indicator: "passed"}
+      })
+      addLog(@runner, {
+        aliasType: "route"
+        message: "@getPosts, function(){}"
+        name: "wait"
+        referencesAlias: [{
+          cardinal: 1
+          name: "getPosts"
+          ordinal: "1st"
+        }],
+      })
+      addLog(@runner, {
+        aliasType: "route"
+        message: "@getPosts, function(){}"
+        name: "wait"
+        referencesAlias: [{
+          cardinal: 2
+          name: "getPosts"
+          ordinal: "2nd"
+        }],
+      })
+
+    it "render with counts in non-event commands", ->
+      cy.contains('.command-number', '1')
+        .parent()
+        .within ->
+          cy.contains('.command-alias-count', '1')
+          cy.contains('.command-alias', '@getPosts')
+            .trigger("mouseover")
+
+      cy.get(".tooltip span").should ($tooltip) ->
+        expect($tooltip).to.contain("Found 1st alias for: 'getPosts'")
+
+      cy.contains('.command-number', '2')
+        .parent()
+        .within ->
+          cy.contains('.command-alias-count', '2')
+          cy.contains('.command-alias', '@getPosts')
+            .trigger("mouseover")
+
+      cy.get(".tooltip span").should ($tooltip) ->
+        expect($tooltip).to.contain("Found 2nd alias for: 'getPosts'")
+
+    it "render with counts in event commands when collapsed", ->
+      cy.get(".command-wrapper")
+        .first()
+        .within ->
+          cy.contains('.num-duplicates', '2')
+          cy.contains('.command-alias', 'getPosts')
+
+    it "render without counts in event commands when expanded", ->
+      cy.get(".command-expander")
+        .first()
+        .click()
+
+      cy.get(".command-wrapper")
+        .first()
+        .within ($commandWrapper) ->
+          cy.get('.num-duplicates').should('not.be.visible')
+          cy.contains('.command-alias', 'getPosts')
+
+  describe "with non-consecutive duplicates", ->
+    beforeEach ->
+      addLog(@runner, {
+        alias: "getPosts"
+        aliasType: "route"
+        displayName: "xhr stub"
+        event: true
+        name: "xhr"
+        renderProps: {message: "GET --- /posts", indicator: "passed"}
+      })
+      addLog(@runner, {
+        alias: "getUsers"
+        aliasType: "route"
+        displayName: "xhr stub"
+        event: true
+        name: "xhr"
+        renderProps: {message: "GET --- /users", indicator: "passed"}
+      })
+      addLog(@runner, {
+        alias: "getPosts"
+        aliasType: "route"
+        displayName: "xhr stub"
+        event: true
+        name: "xhr"
+        renderProps: {message: "GET --- /posts", indicator: "passed"}
+      })
+      addLog(@runner, {
+        aliasType: "route"
+        message: "@getPosts, function(){}"
+        name: "wait"
+        referencesAlias: [{
+          cardinal: 1
+          name: "getPosts"
+          ordinal: "1st"
+        }],
+      })
+      addLog(@runner, {
+        aliasType: "route"
+        message: "@getUsers, function(){}"
+        name: "wait"
+        referencesAlias: [{
+          cardinal: 1
+          name: "getUsers"
+          ordinal: "1st"
+        }],
+      })
+      addLog(@runner, {
+        aliasType: "route"
+        message: "@getPosts, function(){}"
+        name: "wait"
+        referencesAlias: [{
+          cardinal: 2
+          name: "getPosts"
+          ordinal: "2nd"
+        }],
+      })
+
+    it "render with counts", ->
+      cy.contains('.command-number', '1')
+        .parent()
+        .within ->
+          cy.contains('.command-alias-count', '1')
+          cy.contains('.command-alias', '@getPosts')
+            .trigger("mouseover")
+
+      cy.get(".tooltip span").should ($tooltip) ->
+        expect($tooltip).to.contain("Found 1st alias for: 'getPosts'")
+
+      cy.contains('.command-number', '3')
+        .parent()
+        .within ->
+          cy.contains('.command-alias-count', '2')
+          cy.contains('.command-alias', '@getPosts')
+            .trigger("mouseover")
+
+      cy.get(".tooltip span").should ($tooltip) ->
+        expect($tooltip).to.contain("Found 2nd alias for: 'getPosts'")

packages/reporter/cypress/integration/errors_spec.js

@@ -2,7 +2,7 @@ const { EventEmitter } = require('events')
 
 describe('test errors', function () {
   beforeEach(function () {
-    cy.fixture('runnables_errors').as('runnablesErr')
+    cy.fixture('errors_runnables').as('runnablesErr')
 
     // SET ERROR INFO
     this.setError = function (err) {