[Uptime] Synthetic check steps list view #90978

shahzad31 · 2021-02-10T17:01:36Z

Summary

Fixes: #80156

Synthetic check steps list view

i still need to do last successful check in case of error steps and probably few other polishing to align with design

elasticmachine · 2021-02-10T17:57:10Z

Pinging @elastic/uptime (Team:uptime)

paulb-elastic · 2021-02-11T11:21:29Z

I know it’s an early PR, but here’s some things I’ve noticed:

Having clicked through, before the page has loaded, there is an error message suggesting there is no data:
You can click on the row to expand/collapse the step details, but the right hand expander only seems to open, not close (we did discuss and agree to remove this for Synthetic tests only - see comment):
Headline differs from the mock up (@katrin-freihofner, thoughts?)

Steps should probably be lowercase steps
It shows the number succeeded rather than failed (I think this is correct, as there can only ever be 1 step that fails)

We don’t show the last good image for a failed test yet (when added, there’s also a footer/label under each image with the date/time stamp (@katrin-freihofner do you only want to show these timestamps when we are displaying two images, as the time of the test itself is shown in the breadcrumb, or add it for all?)
The click to see full size image has a problem with the labelling, but it doesn’t seem specific to this branch, I’ll raise a separate issue for it

x-pack/plugins/uptime/public/components/synthetics/check_steps/steps_list.tsx

...ins/uptime/public/components/monitor/ping_list/columns/ping_timestamp/step_image_popover.tsx

shahzad31 · 2021-02-11T13:40:54Z

@paulb-elastic Thank you so much for early feedback,

i have resolved your 1, 2, 4 points.

In case of 3, i preserved the already working logic from ping list where we were earlier displaying steps in expanded row.

For 5, i think you already created separate issue.

shahzad31 · 2021-02-11T13:56:10Z

After slack convo, accordions will collapsed by default for successful checks and expanded for failed.

dominiqueclarke

Looks great! A few questions

...plugins/uptime/public/components/monitor/ping_list/columns/ping_timestamp/ping_timestamp.tsx

...ins/uptime/public/components/monitor/ping_list/columns/ping_timestamp/step_image_popover.tsx

x-pack/plugins/uptime/public/components/synthetics/check_steps/expand_row_col.tsx

x-pack/plugins/uptime/public/components/synthetics/check_steps/steps_list.tsx

x-pack/plugins/uptime/public/components/synthetics/executed_step.tsx

x-pack/plugins/uptime/public/components/synthetics/status_badge.tsx

x-pack/plugins/uptime/public/components/synthetics/step_screenshot_display.tsx

x-pack/plugins/uptime/server/lib/requests/get_step_screenshot.ts

x-pack/plugins/uptime/server/rest_api/pings/journey_screenshots.ts

paulb-elastic · 2021-02-11T14:56:25Z

Thanks for the updates @shahzad31

A few other items to mention/discuss:

The last good screenshot doesn’t seem to be shown (I can see the screenshot if I look at the older test result, so know there is one in ES):
There is no date/time stamp in the footer (as shown on the mock up):
Now that the whole row is clickable, but as discussed previously we still want to be able to separately click the thumbnail to get the full size screenshot, should we make the hover area for the thumbnail be the same area as the clickable region (as they are different)?

This makes it a bit confusing in that when clicking with the larger screenshot hover, it clicks through to the step view (which is correct), even through the screenshot was being shown (it’s a bit difficult to explain). @katrin-freihofner what do you think, should we make these regions the same?

shahzad31 · 2021-02-11T18:04:21Z

@paulb-elastic added the timestamps for screenshots, those were tricky to spot 🗡️

shahzad31 · 2021-02-11T18:06:08Z

@paulb-elastic not sure about 3, about separating hover region and click. I think it's not a big deal.

dominiqueclarke

I noticed that this failed step has a thumbnail, but no images when expanded.

Also, I find this layout a bit weird how it has the label step name above the thumbnail.

andrewvc · 2021-02-19T22:11:06Z

x-pack/plugins/uptime/server/lib/requests/get_last_successful_step.ts

+          },
+          {
+            term: {
+              'synthetics.payload.status': 'succeeded',


This shouldn't work because we use enabled: false in our mapping for synthetics.payload. If it is working on your box I'd assume it's a broken mapping.

If we need to filter in this way we should add synthetics.step.status as a field. I've opened elastic/beats#24141 to track this

agreed, our mapping was broken, only @paulb-elastic had it right all along.

shahzad31 · 2021-02-22T11:22:20Z

@elasticmachine merge upstream

…/kibana into synthetics-checks-view

shahzad31 · 2021-03-15T09:27:12Z

@elasticmachine merge upstream

shahzad31 · 2021-03-15T13:08:32Z

@elasticmachine merge upstream

kibanamachine · 2021-03-15T15:15:27Z

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id	before	after	diff
`uptime`	603	607	+4

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
`uptime`	939.5KB	952.0KB	+12.5KB

History

💔 Build #113063 failed cc7f99b
💔 Build #113024 failed cc7f99b
💚 Build #112820 succeeded 2277e40
💚 Build #112496 succeeded 1debf85
💚 Build #111392 succeeded c10df6a

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

cc @shahzad31

dominiqueclarke

LGTM. Two quick things

The console output is open by default, even when nothing is populated. Is that intentional?

Also, the icons in the script step are a bit cut off.

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

kibanamachine · 2021-03-16T15:44:04Z

💚 Backport successful

✅ 7.x / #94716

Successful backport PRs will be merged automatically after passing CI.

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Shahzad <shahzad.muhammad@elastic.co>

shahzad31 added 4 commits February 9, 2021 10:56

wip

8ba5f53

Merge branch 'master' into synthetics-checks-view

8d30c5f

Addew check steps list view

6b31192

Addew check steps list view

8797f45

shahzad31 marked this pull request as ready for review February 10, 2021 17:05

shahzad31 requested a review from a team as a code owner February 10, 2021 17:05

shahzad31 self-assigned this Feb 10, 2021

shahzad31 added v7.12.0 v8.0.0 release_note:enhancement labels Feb 10, 2021

fix i18n

e548040

botelastic bot added the Team:Uptime - DEPRECATED Synthetics & RUM sub-team of Application Observability label Feb 10, 2021

shahzad31 added 2 commits February 11, 2021 09:52

wip

7d92edb

Merge branch 'master' into synthetics-checks-view

db784ac

paulb-elastic mentioned this pull request Feb 11, 2021

[Uptime][Bug] Full size screenshot label is misleading #91119

Closed

Added last successful check image

cd4b69d

shahzad31 commented Feb 11, 2021

View reviewed changes

x-pack/plugins/uptime/public/components/synthetics/check_steps/steps_list.tsx Outdated Show resolved Hide resolved

shahzad31 commented Feb 11, 2021

View reviewed changes

...ins/uptime/public/components/monitor/ping_list/columns/ping_timestamp/step_image_popover.tsx Show resolved Hide resolved

shahzad31 added 2 commits February 11, 2021 15:03

collapse accordion on success step

4efe69a

update breadcrumb test

8707075

dominiqueclarke reviewed Feb 11, 2021

View reviewed changes

update last successful step timestamp

135fbd2

dominiqueclarke reviewed Feb 11, 2021

View reviewed changes

shahzad31 requested a review from dominiqueclarke February 18, 2021 21:33

shahzad31 added 3 commits February 19, 2021 11:17

Merge branch 'master' into synthetics-checks-view

59f9d6f

removed fixed width

5659d5f

update link text

de2f3cf

andrewvc reviewed Feb 19, 2021

View reviewed changes

paulb-elastic added v7.13.0 and removed v7.12.0 labels Feb 22, 2021

kibanamachine and others added 7 commits February 22, 2021 06:22

Merge branch 'master' into synthetics-checks-view

5536311

Merge branch 'master' into synthetics-checks-view

e16344f

Merge branch 'synthetics-checks-view' of https://github.com/shahzad31…

c10df6a

…/kibana into synthetics-checks-view

Merge branch 'master' into synthetics-checks-view

1655bee

resolve conflicts

1debf85

fix breadcrumb and last successfull step screenshot

d1b4167

Merge branch 'master' into synthetics-checks-view

2277e40

Merge branch 'master' into synthetics-checks-view

cc7f99b

shahzad31 closed this Mar 15, 2021

shahzad31 reopened this Mar 15, 2021

Merge branch 'master' into synthetics-checks-view

3670f0a

dominiqueclarke approved these changes Mar 15, 2021

View reviewed changes

shahzad31 added the auto-backport Deprecated - use backport:version if exact versions are needed label Mar 16, 2021

shahzad31 merged commit 09e949e into elastic:master Mar 16, 2021

shahzad31 deleted the synthetics-checks-view branch March 16, 2021 15:41

kibanamachine added a commit to kibanamachine/kibana that referenced this pull request Mar 16, 2021

[Uptime] Synthetic check steps list view (elastic#90978)

5234431

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

kibanamachine mentioned this pull request Mar 16, 2021

[7.x] [Uptime] Synthetic check steps list view (#90978) #94716

Merged

kibanamachine added a commit that referenced this pull request Mar 17, 2021

[Uptime] Synthetic check steps list view (#90978) (#94716)

572af17

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Shahzad <shahzad.muhammad@elastic.co>

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Uptime] Synthetic check steps list view #90978

[Uptime] Synthetic check steps list view #90978

shahzad31 commented Feb 10, 2021 •

edited

Loading

elasticmachine commented Feb 10, 2021

paulb-elastic commented Feb 11, 2021

shahzad31 commented Feb 11, 2021

shahzad31 commented Feb 11, 2021

dominiqueclarke left a comment

paulb-elastic commented Feb 11, 2021

shahzad31 commented Feb 11, 2021

shahzad31 commented Feb 11, 2021

dominiqueclarke left a comment

andrewvc Feb 19, 2021

shahzad31 Feb 22, 2021

shahzad31 commented Feb 22, 2021

shahzad31 commented Mar 15, 2021

shahzad31 commented Mar 15, 2021

kibanamachine commented Mar 15, 2021

dominiqueclarke left a comment •

edited

Loading

kibanamachine commented Mar 16, 2021

[Uptime] Synthetic check steps list view #90978

[Uptime] Synthetic check steps list view #90978

Conversation

shahzad31 commented Feb 10, 2021 • edited Loading

Summary

elasticmachine commented Feb 10, 2021

paulb-elastic commented Feb 11, 2021

shahzad31 commented Feb 11, 2021

shahzad31 commented Feb 11, 2021

dominiqueclarke left a comment

Choose a reason for hiding this comment

paulb-elastic commented Feb 11, 2021

shahzad31 commented Feb 11, 2021

shahzad31 commented Feb 11, 2021

dominiqueclarke left a comment

Choose a reason for hiding this comment

andrewvc Feb 19, 2021

Choose a reason for hiding this comment

shahzad31 Feb 22, 2021

Choose a reason for hiding this comment

shahzad31 commented Feb 22, 2021

shahzad31 commented Mar 15, 2021

shahzad31 commented Mar 15, 2021

kibanamachine commented Mar 15, 2021

💚 Build Succeeded

Metrics [docs]

Module Count

Async chunks

History

dominiqueclarke left a comment • edited Loading

Choose a reason for hiding this comment

kibanamachine commented Mar 16, 2021

💚 Backport successful

shahzad31 commented Feb 10, 2021 •

edited

Loading

dominiqueclarke left a comment •

edited

Loading