diff --git a/cypress/fixtures/build_canceled.json b/cypress/fixtures/build_canceled.json
new file mode 100644
index 000000000..2348af40d
--- /dev/null
+++ b/cypress/fixtures/build_canceled.json
@@ -0,0 +1,27 @@
+{
+  "id": 6,
+  "repo_id": 1,
+  "number": 6,
+  "parent": 1,
+  "event": "push",
+  "status": "canceled",
+  "error": "build canceled in favor of build 7",
+  "enqueued": 1572980376,
+  "created": 1572980376,
+  "started": 1572980375,
+  "finished": 1572980375,
+  "deploy": "",
+  "clone": "https://github.com/github/octocat.git",
+  "source": "https://github.com/github/octocat/commit/9b1d8bded6e992ab660eaee527c5e3232d0a2441",
+  "title": "push received from https://github.com/github/octocat",
+  "message": "fixing docker params",
+  "commit": "9b1d8bded6e992ab660eaee527c5e3232d0a2441",
+  "sender": "CookieCat",
+  "author": "CookieCat",
+  "branch": "infra",
+  "ref": "refs/heads/infra",
+  "base_ref": "",
+  "host": "",
+  "runtime": "docker",
+  "distribution": "linux"
+}
\ No newline at end of file
diff --git a/cypress/integration/build.spec.js b/cypress/integration/build.spec.js
index b32ec54ad..10434c208 100644
--- a/cypress/integration/build.spec.js
+++ b/cypress/integration/build.spec.js
@@ -295,5 +295,31 @@ context('Build', () => {
         cy.get('[data-test=build-error]').contains('failure authenticating');
       });
     });
+
+    context('visit canceled build', () => {
+      beforeEach(() => {
+        cy.visit('/github/octocat/6');
+        cy.get('[data-test=full-build]').as('build');
+        cy.get('@build').get('[data-test=build-status]').as('buildStatus');
+      });
+
+      it('build should have failure style', () => {
+        cy.get('@buildStatus').should('have.class', '-failure');
+      });
+
+      it('build error should show', () => {
+        cy.get('[data-test=build-error]').should('be.visible');
+      });
+
+      it('build error should contain error', () => {
+        cy.get('[data-test=build-error]').contains('msg:');
+        cy.get('[data-test=build-error]').contains('build canceled in favor of build 7');
+      });
+
+      it('clicking superseding build link should direct to new build page', () => {
+        cy.get('[data-test=new-build-link]').click({ force: true });
+        cy.location('pathname').should('eq', '/github/octocat/7');
+      });
+    });
   });
 });
diff --git a/cypress/support/commands.js b/cypress/support/commands.js
index 8528937e0..4ac1ed16c 100644
--- a/cypress/support/commands.js
+++ b/cypress/support/commands.js
@@ -62,6 +62,7 @@ Cypress.Commands.add('stubBuild', () => {
   cy.fixture('build_success.json').as('successBuild');
   cy.fixture('build_failure.json').as('failureBuild');
   cy.fixture('build_error.json').as('errorBuild');
+  cy.fixture('build_canceled.json').as('cancelBuild');
   cy.route({
     method: 'GET',
     url: 'api/v1/repos/*/*/builds/1',
@@ -92,6 +93,18 @@ Cypress.Commands.add('stubBuild', () => {
     status: 200,
     response: '@errorBuild',
   });
+  cy.route({
+    method: 'GET',
+    url: 'api/v1/repos/*/*/builds/6',
+    status: 200,
+    response: '@cancelBuild',
+  });
+  cy.route({
+    method: 'GET',
+    url: 'api/v1/repos/*/*/builds/7',
+    status: 200,
+    response: '@successBuild',
+  });
 });
 
 Cypress.Commands.add('stubBuilds', () => {
diff --git a/src/elm/Pages/Build/View.elm b/src/elm/Pages/Build/View.elm
index 6c71967ac..8429522b5 100644
--- a/src/elm/Pages/Build/View.elm
+++ b/src/elm/Pages/Build/View.elm
@@ -1113,16 +1113,48 @@ viewError build =
                 ]
 
         Vela.Canceled ->
+            let
+                message =
+                    if String.isEmpty build.error then
+                        text "no error message"
+
+                    else
+                        let
+                            tgtBuild =
+                                String.toInt
+                                    (Maybe.withDefault ""
+                                        (List.Extra.last (String.split " " build.error))
+                                    )
+                        in
+                        case tgtBuild of
+                            Nothing ->
+                                text build.error
+
+                            Just num ->
+                                let
+                                    linkList =
+                                        String.split "/" build.link
+
+                                    newLink =
+                                        String.join "/"
+                                            (List.Extra.setAt (List.length linkList - 1)
+                                                (String.fromInt num)
+                                                linkList
+                                            )
+
+                                    msg =
+                                        case List.head (String.split (String.fromInt num) build.error) of
+                                            Nothing ->
+                                                build.error
+
+                                            Just m ->
+                                                m
+                                in
+                                span [] [ text msg, a [ href newLink, Util.testAttribute "new-build-link" ] [ text (String.fromInt num) ] ]
+            in
             div [ class "error", Util.testAttribute "build-error" ]
                 [ span [ class "label" ] [ text "msg:" ]
-                , span [ class "message" ]
-                    [ text <|
-                        if String.isEmpty build.error then
-                            "no error msg"
-
-                        else
-                            build.error
-                    ]
+                , span [ class "message" ] [ message ]
                 ]
 
         _ ->