split improvements and bugfixes

allure-framework · Feb 21, 2025 · 4678ee5 · 4678ee5
1 parent 98b0977
commit 4678ee5
Show file tree

Hide file tree

Showing 8 changed files with 18 additions and 234 deletions.
diff --git a/packages/e2e/test/allure-awesome/testResult.test.ts b/packages/e2e/test/allure-awesome/testResult.test.ts
@@ -1,6 +1,5 @@
 import { expect, test } from "@playwright/test";
-import { layer } from "allure-js-commons";
-import { Stage, Status } from "allure-js-commons";
+import { Stage, Status, layer } from "allure-js-commons";
 import { type ReportBootstrap, boostrapReport, randomNumber } from "../utils/index.js";
 
 let bootstrap: ReportBootstrap;
@@ -82,7 +81,7 @@ test.describe("allure-awesome", () => {
       const randomLeaf = page.getByTestId("tree-leaf").nth(randomNumber(0, 4));
 
       await randomLeaf.click();
-
+      debugger;
       const testTitleText = await page.getByTestId("test-result-info-title").textContent();
       const navCounterText = await page.getByTestId("test-result-nav-current").textContent();
       const pressPrevArrow = await page.getByTestId("test-result-nav-next").isDisabled();

diff --git a/packages/web-awesome/src/assets/scss/index.scss b/packages/web-awesome/src/assets/scss/index.scss
@@ -1,5 +1,5 @@
 @import "fonts.scss";
-@import "typography.scss";
+//@import "typography.scss";
 @import "day.scss";
 @import "night.scss";
 @import "theme.scss";

diff --git a/packages/web-awesome/src/assets/scss/typography.scss b/packages/web-awesome/src/assets/scss/typography.scss
diff --git a/packages/web-awesome/src/components/BaseLayout/index.tsx b/packages/web-awesome/src/components/BaseLayout/index.tsx
@@ -15,12 +15,13 @@ export type BaseLayoutProps = {
 
 export const BaseLayout = () => {
   const { id: testResultId } = route.value;
+
   useEffect(() => {
     if (testResultId) {
       fetchTestResult(testResultId);
       fetchTestResultNav();
     }
-  }, []);
+  }, [testResultId]);
 
   const content = testResultId ? (
     <Loadable

diff --git a/packages/web-awesome/src/components/MainReport/index.tsx b/packages/web-awesome/src/components/MainReport/index.tsx
@@ -3,14 +3,14 @@ import { Header } from "@/components/Header";
 import { ReportBody } from "@/components/ReportBody";
 import { ReportHeader } from "@/components/ReportHeader";
 import { ReportMetadata } from "@/components/ReportMetadata";
-import { isSplitMode, layoutStore } from "@/stores/layout";
+import { isSplitMode } from "@/stores/layout";
 import * as styles from "./styles.scss";
 
 const MainReport = () => {
   return (
     <>
       <Header />
-      <div className={clsx(styles.content, isSplitMode.value && styles["scroll-inside"])}>
+      <div className={clsx(styles.content, isSplitMode.value ? styles["scroll-inside"] : "")}>
         <ReportHeader />
         <ReportMetadata />
         <ReportBody />

diff --git a/packages/web-components/src/assets/scss/typography.scss b/packages/web-components/src/assets/scss/typography.scss
@@ -131,7 +131,7 @@ body {
 
 :global(.paragraphs-code-s) {
   font-size: var(--font-size-s);
-  line-height: var(--line-height-m);
+  line-height: var(--line-height-s);
   font-weight: var(--font-weight-normal);
   letter-spacing: 0;
   font-family: var(--font-family-mono);

diff --git a/packages/web-components/src/components/Tree/Tree.tsx b/packages/web-components/src/components/Tree/Tree.tsx
@@ -1,4 +1,5 @@
 import type { Statistic } from "@allurereport/core-api";
+import type { Signal } from "@preact/signals";
 import cx from "clsx";
 import type { AllureAwesomeRecursiveTree, AllureAwesomeStatus, TreeFiltersState } from "global";
 import type { FunctionComponent } from "preact";
@@ -18,8 +19,8 @@ interface TreeProps {
   toggleTree: (id: string) => void;
   navigateTo: (id: string) => void;
   routeId?: string;
-  statsStore: StoreSignalState<Statistic>;
-  treeFiltersStore: TreeFiltersState;
+  statsStore: Signal<StoreSignalState<Statistic>>;
+  treeFiltersStore: Signal<TreeFiltersState>;
 }
 
 export const Tree: FunctionComponent<TreeProps> = ({
@@ -92,7 +93,7 @@ export const Tree: FunctionComponent<TreeProps> = ({
     <div className={styles.tree}>
       {name && (
         <TreeHeader
-          treeFiltersStore={treeFiltersStore}
+          treeFiltersStore={treeFiltersStore.value}
           statsStore={statsStore}
           categoryTitle={name}
           isOpened={isOpened}

diff --git a/packages/web-components/src/components/Tree/TreeHeader.tsx b/packages/web-components/src/components/Tree/TreeHeader.tsx
@@ -1,8 +1,10 @@
 import { type Statistic, statusesList } from "@allurereport/core-api";
+import type { Signal } from "@preact/signals";
 import { clsx } from "clsx";
 import type { TreeFiltersState } from "global";
 import { type FunctionComponent } from "preact";
 import { ArrowButton } from "@/components/ArrowButton";
+import type { StoreSignalState } from "@/components/Loadable";
 import { Loadable } from "@/components/Loadable";
 import { Text } from "@/components/Typography";
 import styles from "./styles.scss";
@@ -12,7 +14,7 @@ interface TreeHeaderProps {
   categoryTitle: string;
   isOpened: boolean;
   toggleTree: () => void;
-  statsStore: any;
+  statsStore: Signal<StoreSignalState<Statistic>>;
   treeFiltersStore: TreeFiltersState;
 }
 
@@ -50,10 +52,9 @@ export const TreeHeader: FunctionComponent<TreeHeaderProps> = ({
         const treeHeaderBar = statistic
           ? statusesList
               .map((status) => ({ status, value: statistic[status] }))
-              .filter(
-                ({ status, value }) =>
-                  value !== undefined && (statusFilter === "total" || (statusFilter === status && value > 0)),
-              )
+              .filter(({ status, value }) => {
+                return value !== undefined && (statusFilter === "total" || (statusFilter === status && value > 0));
+              })
               .map(({ status, value }) => {
                 const className = clsx(styles["tree-header-bar-item"], styles[status]);
                 const style = { flexGrow: value };