diff options
Diffstat (limited to 'spec/frontend/vue_merge_request_widget/components/states/__snapshots__')
2 files changed, 288 insertions, 204 deletions
diff --git a/spec/frontend/vue_merge_request_widget/components/states/__snapshots__/mr_widget_auto_merge_enabled_spec.js.snap b/spec/frontend/vue_merge_request_widget/components/states/__snapshots__/mr_widget_auto_merge_enabled_spec.js.snap index de25e2a0450..635ef0f6b0d 100644 --- a/spec/frontend/vue_merge_request_widget/components/states/__snapshots__/mr_widget_auto_merge_enabled_spec.js.snap +++ b/spec/frontend/vue_merge_request_widget/components/states/__snapshots__/mr_widget_auto_merge_enabled_spec.js.snap @@ -4,117 +4,171 @@ exports[`MRWidgetAutoMergeEnabled when graphql is disabled template should have <div class="mr-widget-body media" > - <svg - aria-hidden="true" - class="gl-text-blue-500 gl-mr-3 gl-mt-1 gl-icon s24" - data-testid="status_scheduled-icon" - role="img" - > - <use - href="#status_scheduled" - /> - </svg> - <div - class="media-body gl-display-flex" + class="gl-w-6 gl-h-6 gl-display-flex gl-align-self-start gl-mr-3" > - - <h4 - class="gl-mr-3" - data-testid="statusText" + <div + class="gl-display-flex gl-m-auto" > - Set by - <a - class="author-link inline" + <div + class="gl-mr-3 gl-p-2 gl-m-0! gl-text-blue-500 gl-w-6 gl-p-2" > - <img - class="avatar avatar-inline s16" - src="no_avatar.png" - /> - - <span - class="author" + <div + class="gl-rounded-full gl-relative gl-display-flex mr-widget-extension-icon" > - - </span> - </a> - to be merged automatically when the pipeline succeeds - </h4> - + <div + class="gl-absolute gl-top-half gl-left-50p gl-translate-x-n50 gl-display-flex gl-m-auto" + > + <div + class="gl-display-flex gl-m-auto gl-translate-y-n50" + > + <svg + aria-label="Scheduled " + class="gl-display-block gl-icon s12" + data-qa-selector="status_scheduled_icon" + data-testid="status-scheduled-icon" + role="img" + > + <use + href="#status-scheduled" + /> + </svg> + </div> + </div> + </div> + </div> + </div> + </div> + + <div + class="gl-display-flex gl-w-full" + > <div - class="gl-display-flex gl-md-display-block gl-font-size-0 gl-ml-auto gl-mt-1" + class="media-body gl-display-flex" > - <div> - <div - class="dropdown b-dropdown gl-new-dropdown gl-display-block gl-md-display-none! btn-group" - lazy="" - no-caret="" + + <h4 + class="gl-mr-3" + data-testid="statusText" + > + Set by + <a + class="author-link inline" > - <!----> + <img + class="avatar avatar-inline s16" + src="no_avatar.png" + /> + + <span + class="author" + > + + </span> + </a> + to be merged automatically when the pipeline succeeds + </h4> + + <div + class="gl-display-flex gl-md-display-block gl-font-size-0 gl-ml-auto" + > + <div> + <div + class="dropdown b-dropdown gl-new-dropdown gl-display-block gl-md-display-none! btn-group" + lazy="" + no-caret="" + > + <!----> + <button + aria-expanded="false" + aria-haspopup="true" + class="btn dropdown-toggle btn-default btn-sm gl-p-2! gl-button gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret" + type="button" + > + <!----> + + <svg + aria-hidden="true" + class="dropdown-icon gl-icon s16" + data-testid="ellipsis_v-icon" + role="img" + > + <use + href="#ellipsis_v" + /> + </svg> + + <span + class="gl-new-dropdown-button-text gl-sr-only" + > + + </span> + + <svg + aria-hidden="true" + class="gl-button-icon dropdown-chevron gl-icon s16" + data-testid="chevron-down-icon" + role="img" + > + <use + href="#chevron-down" + /> + </svg> + </button> + <ul + class="dropdown-menu dropdown-menu-right" + role="menu" + tabindex="-1" + > + <!----> + </ul> + </div> + <button - aria-expanded="false" - aria-haspopup="true" - class="btn dropdown-toggle btn-default btn-sm gl-p-2! gl-button gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret" + class="btn gl-display-none gl-md-display-block gl-float-left btn-confirm btn-sm gl-button btn-confirm-tertiary js-cancel-auto-merge" + data-qa-selector="cancel_auto_merge_button" + data-testid="cancelAutomaticMergeButton" type="button" > <!----> - <svg - aria-hidden="true" - class="dropdown-icon gl-icon s16" - data-testid="ellipsis_v-icon" - role="img" - > - <use - href="#ellipsis_v" - /> - </svg> - + <!----> + <span - class="gl-new-dropdown-button-text gl-sr-only" + class="gl-button-text" > + Cancel auto-merge + </span> - - <svg - aria-hidden="true" - class="gl-button-icon dropdown-chevron gl-icon s16" - data-testid="chevron-down-icon" - role="img" - > - <use - href="#chevron-down" - /> - </svg> </button> - <ul - class="dropdown-menu dropdown-menu-right" - role="menu" - tabindex="-1" - > - <!----> - </ul> </div> + </div> + </div> + + <div + class="gl-md-display-none gl-border-l-1 gl-border-l-solid gl-border-gray-100 gl-ml-3 gl-pl-3 gl-h-6 gl-mt-1" + > + <button + class="btn gl-vertical-align-top btn-default btn-sm gl-button btn-default-tertiary btn-icon" + title="Collapse merge details" + type="button" + > + <!----> - <button - class="btn gl-display-none gl-md-display-block gl-float-left btn-confirm btn-sm gl-button btn-confirm-tertiary js-cancel-auto-merge" - data-qa-selector="cancel_auto_merge_button" - data-testid="cancelAutomaticMergeButton" - type="button" + <svg + aria-hidden="true" + class="gl-button-icon gl-icon s16" + data-testid="chevron-lg-up-icon" + role="img" > - <!----> - - <!----> - - <span - class="gl-button-text" - > - - Cancel auto-merge - - </span> - </button> - </div> + <use + href="#chevron-lg-up" + /> + </svg> + + <!----> + </button> </div> </div> </div> @@ -124,117 +178,171 @@ exports[`MRWidgetAutoMergeEnabled when graphql is enabled template should have c <div class="mr-widget-body media" > - <svg - aria-hidden="true" - class="gl-text-blue-500 gl-mr-3 gl-mt-1 gl-icon s24" - data-testid="status_scheduled-icon" - role="img" - > - <use - href="#status_scheduled" - /> - </svg> - <div - class="media-body gl-display-flex" + class="gl-w-6 gl-h-6 gl-display-flex gl-align-self-start gl-mr-3" > - - <h4 - class="gl-mr-3" - data-testid="statusText" + <div + class="gl-display-flex gl-m-auto" > - Set by - <a - class="author-link inline" + <div + class="gl-mr-3 gl-p-2 gl-m-0! gl-text-blue-500 gl-w-6 gl-p-2" > - <img - class="avatar avatar-inline s16" - src="no_avatar.png" - /> - - <span - class="author" + <div + class="gl-rounded-full gl-relative gl-display-flex mr-widget-extension-icon" > - - </span> - </a> - to be merged automatically when the pipeline succeeds - </h4> - + <div + class="gl-absolute gl-top-half gl-left-50p gl-translate-x-n50 gl-display-flex gl-m-auto" + > + <div + class="gl-display-flex gl-m-auto gl-translate-y-n50" + > + <svg + aria-label="Scheduled " + class="gl-display-block gl-icon s12" + data-qa-selector="status_scheduled_icon" + data-testid="status-scheduled-icon" + role="img" + > + <use + href="#status-scheduled" + /> + </svg> + </div> + </div> + </div> + </div> + </div> + </div> + + <div + class="gl-display-flex gl-w-full" + > <div - class="gl-display-flex gl-md-display-block gl-font-size-0 gl-ml-auto gl-mt-1" + class="media-body gl-display-flex" > - <div> - <div - class="dropdown b-dropdown gl-new-dropdown gl-display-block gl-md-display-none! btn-group" - lazy="" - no-caret="" + + <h4 + class="gl-mr-3" + data-testid="statusText" + > + Set by + <a + class="author-link inline" > - <!----> + <img + class="avatar avatar-inline s16" + src="no_avatar.png" + /> + + <span + class="author" + > + + </span> + </a> + to be merged automatically when the pipeline succeeds + </h4> + + <div + class="gl-display-flex gl-md-display-block gl-font-size-0 gl-ml-auto" + > + <div> + <div + class="dropdown b-dropdown gl-new-dropdown gl-display-block gl-md-display-none! btn-group" + lazy="" + no-caret="" + > + <!----> + <button + aria-expanded="false" + aria-haspopup="true" + class="btn dropdown-toggle btn-default btn-sm gl-p-2! gl-button gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret" + type="button" + > + <!----> + + <svg + aria-hidden="true" + class="dropdown-icon gl-icon s16" + data-testid="ellipsis_v-icon" + role="img" + > + <use + href="#ellipsis_v" + /> + </svg> + + <span + class="gl-new-dropdown-button-text gl-sr-only" + > + + </span> + + <svg + aria-hidden="true" + class="gl-button-icon dropdown-chevron gl-icon s16" + data-testid="chevron-down-icon" + role="img" + > + <use + href="#chevron-down" + /> + </svg> + </button> + <ul + class="dropdown-menu dropdown-menu-right" + role="menu" + tabindex="-1" + > + <!----> + </ul> + </div> + <button - aria-expanded="false" - aria-haspopup="true" - class="btn dropdown-toggle btn-default btn-sm gl-p-2! gl-button gl-dropdown-toggle btn-default-tertiary dropdown-icon-only dropdown-toggle-no-caret" + class="btn gl-display-none gl-md-display-block gl-float-left btn-confirm btn-sm gl-button btn-confirm-tertiary js-cancel-auto-merge" + data-qa-selector="cancel_auto_merge_button" + data-testid="cancelAutomaticMergeButton" type="button" > <!----> - <svg - aria-hidden="true" - class="dropdown-icon gl-icon s16" - data-testid="ellipsis_v-icon" - role="img" - > - <use - href="#ellipsis_v" - /> - </svg> - + <!----> + <span - class="gl-new-dropdown-button-text gl-sr-only" + class="gl-button-text" > + Cancel auto-merge + </span> - - <svg - aria-hidden="true" - class="gl-button-icon dropdown-chevron gl-icon s16" - data-testid="chevron-down-icon" - role="img" - > - <use - href="#chevron-down" - /> - </svg> </button> - <ul - class="dropdown-menu dropdown-menu-right" - role="menu" - tabindex="-1" - > - <!----> - </ul> </div> + </div> + </div> + + <div + class="gl-md-display-none gl-border-l-1 gl-border-l-solid gl-border-gray-100 gl-ml-3 gl-pl-3 gl-h-6 gl-mt-1" + > + <button + class="btn gl-vertical-align-top btn-default btn-sm gl-button btn-default-tertiary btn-icon" + title="Collapse merge details" + type="button" + > + <!----> - <button - class="btn gl-display-none gl-md-display-block gl-float-left btn-confirm btn-sm gl-button btn-confirm-tertiary js-cancel-auto-merge" - data-qa-selector="cancel_auto_merge_button" - data-testid="cancelAutomaticMergeButton" - type="button" + <svg + aria-hidden="true" + class="gl-button-icon gl-icon s16" + data-testid="chevron-lg-up-icon" + role="img" > - <!----> - - <!----> - - <span - class="gl-button-text" - > - - Cancel auto-merge - - </span> - </button> - </div> + <use + href="#chevron-lg-up" + /> + </svg> + + <!----> + </button> </div> </div> </div> diff --git a/spec/frontend/vue_merge_request_widget/components/states/__snapshots__/mr_widget_pipeline_failed_spec.js.snap b/spec/frontend/vue_merge_request_widget/components/states/__snapshots__/mr_widget_pipeline_failed_spec.js.snap deleted file mode 100644 index 7e741bf4660..00000000000 --- a/spec/frontend/vue_merge_request_widget/components/states/__snapshots__/mr_widget_pipeline_failed_spec.js.snap +++ /dev/null @@ -1,24 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`PipelineFailed should render error message with a disabled merge button 1`] = ` -<div - class="mr-widget-body media" -> - <status-icon-stub - show-disabled-button="true" - status="warning" - /> - - <div - class="media-body space-children" - > - <span - class="gl-ml-0! gl-text-body! bold" - > - <gl-sprintf-stub - message="Merge blocked: pipeline must succeed. Push a commit that fixes the failure, or %{linkStart}learn about other solutions.%{linkEnd}" - /> - </span> - </div> -</div> -`; |