feat(ui): add retry icon in browser gui (#30)

when a test fails and retries, now we append an orange 'x' beside the test status icon, to let you know it failed.

If the test fails, we hide the orange 'x' and just show the red one.

README.md

@@ -16,7 +16,6 @@
 > [Please refer to this issue for updates about official cypress retry support](https://github.com/cypress-io/cypress/issues/1313)
 
 ![](docs/readme-screenshot.png)
-![](2019-02-12-13-29-53.png)
 
 ### Installation
 

cypress/tests/unit/main.spec.js

@@ -158,6 +158,8 @@ describe('deeply nested', () => {
       'AE 0',
       'AA 0',
     ])
+
+    expect(cy.$$('.runnable-title:contains(T 2)', top.document).parent().children('i').length).eq(5)
   })
 })
 

cypress/tests/unit/pretty-demo.spec.js

@@ -0,0 +1,12 @@
+describe('Some flaky suite', () => {
+  let counter = 0
+
+  beforeEach(() => {
+    Cypress.currentTest.retries(4)
+  })
+
+  it('should pass on 3rd attempt', () => {
+    counter++
+    expect(counter === 3, 'some flaky assertion').eq(true)
+  })
+})

cypress/tests/unit/retries-hidden.spec.js

@@ -2,13 +2,14 @@
 
 const { _ } = Cypress
 
-Cypress.env('RETRIES_HIDDEN', true)
-
 if (!top.alreadyRan) {
+  Cypress.env('RETRIES_HIDDEN', true)
   top.alreadyRan = true
   cy.$$('.restart', top.document).click()
 }
 
+expect(Cypress.env('RETRIES_HIDDEN')).ok
+
 const failTwice = _.before(3, () => {
   throw new Error('foo')
 })
@@ -20,7 +21,7 @@ describe('suite', () => {
 
     cy.wait(10).should(() => {
       failTwice()
-      cy.wrap(cy.$$('.retry-0', top.document)).should('not.be.visible')
+      cy.wrap(cy.$$('.command.retry-0', top.document)).should('not.be.visible')
     })
 
   })