@allurereport/web-classic 3.0.0-beta.8 → 3.0.0

package/src/components/language-select/styles.scss

@@ -1,34 +0,0 @@
-@import "../../variables.scss";
-
-.language-select {
-  z-index: 1;
-  &.popover {
-    padding: 0;
-  }
-  &__menu {
-    list-style-type: none;
-    padding: 0;
-    margin: 0;
-  }
-  &__item {
-    padding: 0.5em 0.8em;
-    border-bottom: 1px solid $border-color;
-    cursor: pointer;
-    &::before {
-      content: " ";
-      display: inline-block;
-      background: url(checkmark.svg?inline) center no-repeat;
-      background-size: contain;
-      width: 0.8em;
-      height: 0.8em;
-      margin-right: 0.5em;
-      visibility: hidden;
-    }
-    &_active::before {
-      visibility: visible;
-    }
-    &:hover {
-      background: $hover-color;
-    }
-  }
-}

package/src/components/loader/LoaderView.hbs

@@ -1,6 +0,0 @@
-<div class="loader__mask">
-    <div class="loader">
-        {{spinner}}
-        <p class="loader__text">{{text}}</p>
-    </div>
-</div>

package/src/components/loader/LoaderView.js

@@ -1,21 +0,0 @@
-import { View } from "backbone.marionette";
-import { options } from "@/decorators/index.js";
-import template from "./LoaderView.hbs";
-import "./styles.scss";
-
-@options({
-  text: "Loading...",
-})
-class LoaderView extends View {
-  template = template;
-
-  initialize(opts) {
-    this.options = opts;
-  }
-
-  serializeData() {
-    return this.options;
-  }
-}
-
-export default LoaderView;

package/src/components/loader/styles.scss

@@ -1,26 +0,0 @@
-@import "../../variables.scss";
-
-.loader {
-  margin: auto;
-  text-align: center;
-  &__mask {
-    position: relative;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    display: flex;
-  }
-  &__text {
-    font-size: 14px;
-    margin-top: 1em;
-  }
-}
-
-.loader_container {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  margin-left: -19px;
-  margin-top: -19px;
-}

package/src/components/marks-toggle/MarksToggleView.hbs

@@ -1,14 +0,0 @@
-<div class="{{b 'marks-toggle' 'items'}}">
-    {{t 'component.tree.filter-marks'}}:
-    {{#each marks}}
-        <div class="{{b 'marks-toggle' 'item'}}">
-        {{#if active}}
-            <span class="{{b 'marks-toggle' 'mark' y=true}} y-label-mark y-label_mark_{{mark}}" data-mark="{{mark}}"
-                    data-tooltip="{{t 'component.markToggle.hideCases' mark=markName}}">{{allure-icon mark noTooltip=true width="18px" height="18px"}}</span>
-        {{else}}
-            <span class="{{b 'marks-toggle' 'mark' n=true}} n-label-mark n-label_mark_{{mark}}" data-mark="{{mark}}"
-                    data-tooltip="{{t 'component.markToggle.showCases' mark=markName}}">{{allure-icon mark noTooltip=true width="18px" height="18px"}}</span>
-        {{/if}}
-        </div>
-    {{/each}}
-</div>

package/src/components/marks-toggle/MarksToggleView.js

@@ -1,41 +0,0 @@
-import { View } from "backbone.marionette";
-import { className, on } from "@/decorators/index.js";
-import translate from "@/helpers/t.js";
-import gtag from "@/utils/gtag.js";
-import { values } from "@/utils/marks.js";
-import template from "./MarksToggleView.hbs";
-import "./styles.scss";
-
-@className("marks-toggle")
-class MarksToggleView extends View {
-  template = template;
-
-  initialize({ settings }) {
-    this.settings = settings;
-    this.listenTo(settings, "change", this.render);
-  }
-
-  serializeData() {
-    const marks = this.settings.getVisibleMarks();
-    return {
-      marks: values.map((mark) => ({
-        mark,
-        markName: translate(`marks.${mark}`, {}),
-        active: !!marks[mark],
-        count: this.statistic ? this.statistic[status.toLowerCase()] : 0,
-      })),
-    };
-  }
-
-  @on("click .y-label-mark, .n-label-mark")
-  onToggleMark(e) {
-    const el = this.$(e.currentTarget);
-    const name = el.data("mark");
-    const checked = el.hasClass("n-label-mark");
-    const marks = this.settings.getVisibleMarks();
-    this.settings.setVisibleMarks(Object.assign({}, marks, { [name]: checked }));
-    gtag("marks_toggle_click", { status: name, checked });
-  }
-}
-
-export default MarksToggleView;

package/src/components/marks-toggle/styles.scss

@@ -1,38 +0,0 @@
-.marks-toggle {
-  &__items {
-    display: flex;
-    align-items: center;
-    gap: 0 4px;
-    user-select: none;
-    word-break: break-word;
-  }
-
-  &__item {
-    flex: 0 0 24px;
-    width: 24px;
-    height: 24px;
-    cursor: pointer;
-    white-space: nowrap;
-    position: relative;
-  }
-
-  &__mark {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 100%;
-    height: 100%;
-    border-radius: 3px;
-    border-width: 1px;
-    border-style: solid;
-
-    &_y {
-      background: #97cc64;
-      border-color: #97cc64;
-      color: #fff;
-    }
-
-    &_n {
-    }
-  }
-}

package/src/components/modal/styles.scss

@@ -1,31 +0,0 @@
-@import "../../variables.scss";
-
-.modal {
-  &__background {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    top: 0;
-    margin: 0 auto;
-    overflow: auto;
-    background-color: rgba(235, 235, 235, 0.7);
-    z-index: 1000;
-  }
-  &__title {
-    display: flex;
-  }
-  &__close {
-    margin-left: auto;
-  }
-  &__window {
-    position: absolute;
-    width: 90%;
-    margin-left: 5%;
-    top: 0;
-    z-index: 1001;
-  }
-}
-
-.blur {
-  filter: blur(3px);
-}

package/src/components/node-search/NodeSearchView.hbs

@@ -1,4 +0,0 @@
-<div class="search__container">
-    <input class="search__input"
-           type="text"/>
-</div>

package/src/components/node-search/NodeSearchView.js

@@ -1,32 +0,0 @@
-import { View } from "backbone.marionette";
-import { className, on } from "@/decorators/index.js";
-import gtag from "@/utils/gtag.js";
-import template from "./NodeSearchView.hbs";
-import "./styles.scss";
-
-export const SEARCH_QUERY_KEY = "searchQuery";
-
-@className("search")
-class NodeSearchView extends View {
-  template = template;
-
-  initialize({ state }) {
-    this.state = state;
-  }
-
-  onRender() {
-    this.$("input").val(this.state.get(SEARCH_QUERY_KEY));
-  }
-
-  @on("input input")
-  onChangeSorting(e) {
-    this.state.set(SEARCH_QUERY_KEY, e.target.value);
-    gtag("search");
-  }
-
-  close() {
-    this.state.set(SEARCH_QUERY_KEY, "");
-  }
-}
-
-export default NodeSearchView;

package/src/components/node-search/styles.scss

@@ -1,29 +0,0 @@
-@import "../../variables.scss";
-
-.search {
-  &__container {
-    width: 100%;
-    max-width: 350px;
-    float: right;
-  }
-  &__input {
-    width: 100%;
-    height: 32px;
-    font-size: 0.8em;
-    display: inline-block;
-    padding: 0 30px 0 10px;
-    border: 1px solid $border-accent-color;
-    line-height: 20px;
-    background: no-repeat right 8px center;
-    &:hover {
-      border-color: #888;
-    }
-    &:focus {
-      border-color: #51a7e8;
-      outline: none;
-      box-shadow:
-        inset 0 1px 2px rgba(0, 0, 0, 0.075),
-        0 0 5px rgba(81, 167, 232, 0.5);
-    }
-  }
-}

package/src/components/node-sorter/NodeSorterView.hbs

@@ -1,22 +0,0 @@
-<div class="sorter">
-{{#each sorters}}
-    <div class="{{b 'sorter' 'item'}}"
-         data-name="{{name}}"
-         data-asc="{{asc}}"
-         data-ga4-event="sort_click"
-         data-ga4-param-name="{{name}}">
-        <span class="{{b 'sorter' enabled=(or asc desc)}} {{b 'sorter' 'name'}}">{{t name}}</span>
-        <svg width="16px" height="16px" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-          <g clip-path="url(#clip0_7_44)">
-            <path class="{{b 'sorter' enabled=asc}}" data-asc="true" d="M16 28L9 21L10.41 19.59L16 25.17L21.59 19.59L23 21L16 28Z" fill="currentColor"/>
-            <path class="{{b 'sorter' enabled=desc}}" data-desc="true" d="M16 4L23 11L21.59 12.41L16 6.83L10.41 12.41L9 11L16 4Z" fill="currentColor"/>
-          </g>
-          <defs>
-            <clipPath id="clip0_7_44">
-              <rect width="32" height="32" fill="white"/>
-            </clipPath>
-          </defs>
-        </svg>
-    </div>
-{{/each}}
-</div>

package/src/components/node-sorter/NodeSorterView.js

@@ -1,43 +0,0 @@
-import { View } from "backbone.marionette";
-import { className, on } from "@/decorators/index.js";
-import template from "./NodeSorterView.hbs";
-import "./styles.scss";
-
-const AVAILABLE_SORTERS = ["sorter.order", "sorter.name", "sorter.duration", "sorter.status"];
-
-@className("sorter")
-class NodeSorterView extends View {
-  template = template;
-
-  initialize({ settings }) {
-    this.settings = settings;
-  }
-
-  @on("click .sorter__item")
-  onChangeSorting(e) {
-    const el = this.$(e.currentTarget);
-    this.settings.setTreeSorting({
-      sorter: el.data("name"),
-      ascending: !el.data("asc"),
-    });
-
-    const ascending = el.data("asc");
-    this.$(".sorter_enabled").toggleClass("sorter_enabled");
-    el.data("asc", !ascending);
-    el.find(".sorter__name").toggleClass("sorter_enabled");
-    el.find(ascending ? "[data-asc]" : "[data-desc]").toggleClass("sorter_enabled");
-  }
-
-  serializeData() {
-    const sortSettings = this.settings.getTreeSorting();
-    return {
-      sorters: AVAILABLE_SORTERS.map((sorter) => ({
-        name: sorter,
-        asc: sortSettings.sorter === sorter && sortSettings.ascending,
-        desc: sortSettings.sorter === sorter && !sortSettings.ascending,
-      })),
-    };
-  }
-}
-
-export default NodeSorterView;

package/src/components/node-sorter/styles.scss

@@ -1,26 +0,0 @@
-@import "../../variables.scss";
-
-.sorter {
-  overflow: hidden;
-  color: $text-muted-color;
-  user-select: none;
-
-  &_enabled {
-    color: $text-color;
-  }
-
-  &__item {
-    cursor: pointer;
-    display: inline-flex;
-    align-items: center;
-    padding-right: $gap-size;
-  }
-
-  &__icon {
-    display: none;
-
-    &_visible {
-      display: block;
-    }
-  }
-}

package/src/components/popover/PopoverView.js

@@ -1,8 +0,0 @@
-import TooltipView from "@/components/tooltip/TooltipView.js";
-import { className } from "@/decorators/index.js";
-import "./styles.scss";
-
-@className("popover")
-class PopoverView extends TooltipView {}
-
-export default PopoverView;

package/src/components/popover/styles.scss

@@ -1,32 +0,0 @@
-@import "../../variables.scss";
-
-.popover {
-  position: absolute;
-  background: $pane-bg-color;
-  color: $text-color;
-  border: 1px solid $border-accent-color;
-  padding: 8px;
-  font-size: 14px;
-  &::before,
-  &::after {
-    content: " ";
-    position: absolute;
-    border: 8px solid transparent;
-    top: 50%;
-    margin-top: -8px;
-  }
-  &_position_right {
-    &::before {
-      left: -16px;
-      border-right-color: $border-accent-color;
-    }
-    &::after {
-      left: -15px;
-      border-right-color: $pane-bg-color;
-    }
-  }
-  &__list {
-    margin: 0.5em 0;
-    padding-left: 20px;
-  }
-}

package/src/components/side-by-side/SideBySideView.hbs

@@ -1,2 +0,0 @@
-<div class="side-by-side__left"></div>
-<div class="side-by-side__right"></div>

package/src/components/side-by-side/SideBySideView.js

@@ -1,42 +0,0 @@
-import { View } from "backbone.marionette";
-import split from "split.js";
-import { className, regions } from "@/decorators/index.js";
-import gtag from "@/utils/gtag.js";
-import settings from "@/utils/settings.js";
-import template from "./SideBySideView.hbs";
-import "./styles.scss";
-
-@className("side-by-side")
-@regions({
-  left: ".side-by-side__left",
-  right: ".side-by-side__right",
-})
-class SideBySideView extends View {
-  template = template;
-
-  onAttach() {
-    const splitter = split([".side-by-side__left", ".side-by-side__right"], {
-      gutterSize: 7,
-      sizes: settings.getSideBySidePosition(),
-      onDragEnd: function () {
-        const sizes = splitter.getSizes();
-        settings.setSideBySidePosition(sizes);
-        gtag("side-by-side-resize", { sizes });
-      },
-    });
-  }
-
-  onRender() {
-    const { left, right } = this.options;
-    this.showChildView("left", left);
-    this.showChildView("right", right);
-  }
-
-  templateContext() {
-    return {
-      cls: "side-by-side",
-    };
-  }
-}
-
-export default SideBySideView;

package/src/components/side-by-side/styles.scss

@@ -1,59 +0,0 @@
-@import "../../variables.scss";
-
-.side-by-side {
-  height: 100%;
-  width: 100%;
-  padding: 0;
-  margin: 0;
-  overflow: hidden;
-  display: flex;
-  position: absolute;
-}
-
-[dir="ltr"] .side-by-side {
-  direction: ltr;
-  flex-direction: row;
-
-  &__left {
-    overflow: auto;
-    flex: 0 0 auto;
-  }
-
-  &__right {
-    overflow: auto;
-    flex: 1 1 auto;
-  }
-}
-
-[dir="rtl"] .side-by-side {
-  direction: ltr;
-  box-orient: horizontal;
-  flex-direction: row-reverse;
-
-  &__left {
-    direction: rtl;
-    overflow: auto;
-    flex: 0 0 auto;
-  }
-
-  &__right {
-    direction: rtl;
-    overflow: auto;
-    flex: 1 1 auto;
-  }
-}
-
-[dir="rtl"] .tree__ctrl {
-  overflow: hidden;
-}
-
-.gutter {
-  background: $border-color no-repeat 50%;
-  &:hover {
-    cursor: ew-resize;
-  }
-}
-
-.gutter-horizontal {
-  background-image: url("vertical.png");
-}

package/src/components/status-toggle/StatusToggleView.hbs

@@ -1,16 +0,0 @@
-<div class="{{b 'status-toggle' 'items'}}">
-    {{t 'component.tree.filter'}}:
-    {{#each statuses}}
-        <div class="{{b 'status-toggle' 'item'}}">
-        {{#if active}}
-            <span class="y-label y-label_status_{{status}}"
-                  data-status="{{status}}"
-                  data-tooltip="{{t 'component.statusToggle.hideCases' status=statusName}}">{{count}}</span>
-        {{else}}
-            <span class="n-label n-label_status_{{status}}"
-                  data-status="{{status}}"
-                  data-tooltip="{{t 'component.statusToggle.showCases' status=statusName}}">{{count}}</span>
-        {{/if}}
-        </div>
-    {{/each}}
-</div>

package/src/components/status-toggle/StatusToggleView.js

@@ -1,42 +0,0 @@
-import { View } from "backbone.marionette";
-import { className, on } from "@/decorators/index.js";
-import translate from "@/helpers/t.js";
-import gtag from "@/utils/gtag.js";
-import { values } from "@/utils/statuses.js";
-import template from "./StatusToggleView.hbs";
-import "./styles.scss";
-
-@className("status-toggle")
-class StatusToggleView extends View {
-  template = template;
-
-  initialize({ settings, statistic }) {
-    this.settings = settings;
-    this.statistic = statistic;
-    this.listenTo(settings, "change", this.render);
-  }
-
-  serializeData() {
-    const statuses = this.settings.getVisibleStatuses();
-    return {
-      statuses: values.map((status) => ({
-        status,
-        statusName: translate(`status.${status}`, {}),
-        active: !!statuses[status],
-        count: this.statistic ? this.statistic[status.toLowerCase()] : 0,
-      })),
-    };
-  }
-
-  @on("click .y-label, .n-label")
-  onToggleStatus(e) {
-    const el = this.$(e.currentTarget);
-    const name = el.data("status");
-    const checked = el.hasClass("n-label");
-    const statuses = this.settings.getVisibleStatuses();
-    this.settings.setVisibleStatuses(Object.assign({}, statuses, { [name]: checked }));
-    gtag("status_toggle_click", { status: name, checked });
-  }
-}
-
-export default StatusToggleView;

package/src/components/status-toggle/styles.scss

@@ -1,35 +0,0 @@
-@import "../../mixins.scss";
-
-.status-toggle {
-  &__items {
-    display: block;
-    user-select: none;
-    word-break: break-word;
-  }
-  &__item {
-    cursor: pointer;
-    padding: 5px 0 5px 0;
-    display: inline-block;
-    white-space: nowrap;
-  }
-}
-
-.y-label {
-  vertical-align: baseline;
-  letter-spacing: 1px;
-  color: #fff;
-  padding: 2px 4px 2px 5px;
-  border-radius: 3px;
-  @include status-bg-bright();
-}
-
-.n-label {
-  vertical-align: baseline;
-  letter-spacing: 1px;
-  padding: 1px 3px 1px 4px;
-  border-radius: 3px;
-  border: 1px solid;
-  font-weight: bold;
-  @include status-text();
-  @include status-border();
-}

package/src/components/testresult-execution/TestResultExecutionView.hbs

@@ -1,13 +0,0 @@
-<h3 class="test-result-execution__title">{{t 'testResult.execution.name'}}</h3>
-
-{{#if hasContent}}
-    <div class="execution__content">
-        {{~> stages-block stages=before name=(t 'testResult.execution.setup') baseUrl=baseUrl expanded=false}}
-        {{~> stages-block stages=test name=(t 'testResult.execution.body') baseUrl=baseUrl expanded=true}}
-        {{~> stages-block stages=after name=(t 'testResult.execution.teardown') baseUrl=baseUrl expanded=false}}
-    </div>
-{{else}}
-    <div class="{{b 'pane' 'section'}}">
-        No information about test execution is available.
-    </div>
-{{/if}}