Merge pull request #4058 from concourse/issue/4051

web: collapse build steps by default
This commit is contained in:
Alex Suraci 2019-06-25 09:43:46 -04:00 committed by GitHub
commit c0482967ac
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 100 additions and 38 deletions

View File

@ -164,10 +164,6 @@ li.prep-status {
}
}
.step-collapsed {
display: none;
}
.step-body {
padding: 10px;
}

View File

@ -67,7 +67,7 @@ type alias Step =
, state : StepState
, log : Ansi.Log.Model
, error : Maybe String
, expanded : Maybe Bool
, expanded : Bool
, version : Maybe Version
, metadata : List MetadataField
, firstOccurrence : Bool

View File

@ -159,21 +159,21 @@ initBottom hl create id name =
, expanded =
case hl of
HighlightNothing ->
Nothing
False
HighlightLine stepID _ ->
if id == stepID then
Just True
True
else
Nothing
False
HighlightRange stepID _ _ ->
if id == stepID then
Just True
True
else
Nothing
False
, version = Nothing
, metadata = []
, firstOccurrence = False
@ -318,10 +318,7 @@ finished root =
toggleStep : StepID -> StepTreeModel -> ( StepTreeModel, List Effect )
toggleStep id root =
( updateAt
id
(map (\step -> { step | expanded = toggleExpanded step }))
root
( updateAt id (map (\step -> { step | expanded = not step.expanded })) root
, []
)
@ -373,11 +370,6 @@ extendHighlight id line root =
( { root | highlight = hl }, [ ModifyUrl (showHighlight hl) ] )
toggleExpanded : Step -> Maybe Bool
toggleExpanded { expanded, state } =
Just <| not <| Maybe.withDefault (autoExpanded state) expanded
updateTooltip :
{ a | hovered : Maybe DomID }
-> { b | hoveredCounter : Int }
@ -535,11 +527,6 @@ isActive state =
state /= StepStatePending && state /= StepStateCancelled
autoExpanded : StepState -> Bool
autoExpanded state =
isActive state && state /= StepStateSucceeded
viewStep : StepTreeModel -> Session -> Step -> StepHeaderType -> Html Message
viewStep model session { id, name, log, state, error, expanded, version, metadata, timestamps, initialize, start, finish } headerType =
Html.div
@ -566,15 +553,11 @@ viewStep model session { id, name, log, state, error, expanded, version, metadat
, viewStepState state id (viewDurationTooltip initialize start finish (model.tooltip == Just (StepState id)))
]
]
, Html.div
[ classList
[ ( "step-body", True )
, ( "clearfix", True )
, ( "step-collapsed", not <| Maybe.withDefault (autoExpanded state) expanded )
, if expanded then
Html.div
[ class "step-body"
, class "clearfix"
]
]
<|
if Maybe.withDefault (autoExpanded state) (Maybe.map (always True) expanded) then
[ viewMetadata metadata
, Html.pre [ class "timestamped-logs" ] <|
viewLogs log timestamps model.highlight session.timeZone id
@ -586,8 +569,8 @@ viewStep model session { id, name, log, state, error, expanded, version, metadat
Html.span [ class "error" ] [ Html.pre [] [ Html.text msg ] ]
]
else
[]
else
Html.text ""
]

View File

@ -883,6 +883,12 @@ all =
Time.customZone (5 * 60) []
)
|> Tuple.first
|> Application.update
(Msgs.Update <|
Message.Message.Click <|
Message.Message.StepHeader "stepid"
)
|> Tuple.first
|> Common.queryView
|> Query.findAll [ class "timestamped-line" ]
|> Query.first
@ -2476,7 +2482,82 @@ all =
)
>> Tuple.first
in
[ test "build step header lays out horizontally" <|
[ test "step is collapsed by default" <|
fetchPlanWithGetStep
>> Application.handleDelivery
(EventsReceived <|
Ok <|
[ { url =
eventsUrl
, data =
STModels.InitializeGet
{ source = ""
, id = "plan"
}
(Time.millisToPosix 0)
}
]
)
>> Tuple.first
>> Common.queryView
>> Query.hasNot [ class "step-body" ]
, test "step expands on click" <|
fetchPlanWithGetStep
>> Application.handleDelivery
(EventsReceived <|
Ok <|
[ { url =
eventsUrl
, data =
STModels.InitializeGet
{ source = ""
, id = "plan"
}
(Time.millisToPosix 0)
}
]
)
>> Tuple.first
>> Application.update
(Msgs.Update <|
Message.Message.Click <|
Message.Message.StepHeader "plan"
)
>> Tuple.first
>> Common.queryView
>> Query.has [ class "step-body" ]
, test "expanded step collapses on click" <|
fetchPlanWithGetStep
>> Application.handleDelivery
(EventsReceived <|
Ok <|
[ { url =
eventsUrl
, data =
STModels.InitializeGet
{ source = ""
, id = "plan"
}
(Time.millisToPosix 0)
}
]
)
>> Tuple.first
>> Application.update
(Msgs.Update <|
Message.Message.Click <|
Message.Message.StepHeader "plan"
)
>> Tuple.first
>> Application.update
(Msgs.Update <|
Message.Message.Click <|
Message.Message.StepHeader "plan"
)
>> Tuple.first
>> Common.queryView
>> Query.hasNot [ class "step-body" ]
, test "build step header lays out horizontally" <|
fetchPlanWithGetStep
>> Common.queryView
>> Query.find [ class "header" ]

View File

@ -55,7 +55,7 @@ someVersionedStep version id name state =
, state = state
, log = cookedLog
, error = Nothing
, expanded = Nothing
, expanded = False
, version = version
, metadata = []
, firstOccurrence = False

View File

@ -29,9 +29,11 @@ test('shows abort hooks', async t => {
await t.context.web.waitForText("say-bye-from-step");
await t.context.web.waitForText("say-bye-from-job");
await t.context.web.waitForText("looping");
// await t.context.web.waitForText("looping");
await t.context.web.clickAndWait('button[title="Abort Build"]', '.build-header[style*="rgb(139, 87, 42)"]'); // brown
await t.context.web.page.waitFor('button[title="Abort Build"]');
await t.context.web.page.click('button[title="Abort Build"]');
await t.context.web.page.waitForSelector( '.build-header[style*="rgb(139, 87, 42)"]', {timeout: 360000}); // brown
await t.context.web.page.waitFor('[data-step-name="say-bye-from-step"] [data-step-state="succeeded"]');
await t.context.web.page.waitFor('[data-step-name="say-bye-from-job"] [data-step-state="succeeded"]');