Skip to content

Commit f6f3de5

Browse files
ncamerancamera
authored
Add scrollbar support in the ch-code and improve resets in the ch-markdown-viewer (#394)
* Add tests for the ch-code * Add scrollbar support in the ch-code * Improve resets in the ch-markdown-viewer * Add test with skip * Update readmes
1 parent 907e295 commit f6f3de5

File tree

6 files changed

+32
-5
lines changed

6 files changed

+32
-5
lines changed

‎src/components/code/code.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -302,6 +302,7 @@
302302
grid-template-rows: 1fr;
303303
font-family: monospace;
304304
white-space: pre;
305+
overflow: auto;
305306
}
306307

307308
code {

‎src/components/code/tests/code.e2e.ts‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ describe("[ch-code]", () => {
9595
);
9696
});
9797

98-
it("should have white-space: pre the Host to properly display the content", async () => {
98+
it('should have "white-space: pre" to properly display the content', async () => {
9999
const page = await newE2EPage();
100100
await page.setContent(`<ch-code language="typescript"></ch-code>`);
101101
const codeRef = await page.find("ch-code");
@@ -105,6 +105,16 @@ describe("[ch-code]", () => {
105105
expect(computedStyle.whiteSpace).toBe("pre");
106106
});
107107

108+
it('should have "overflow: auto" to properly display the content', async () => {
109+
const page = await newE2EPage();
110+
await page.setContent(`<ch-code language="typescript"></ch-code>`);
111+
const codeRef = await page.find("ch-code");
112+
113+
const computedStyle = await codeRef.getComputedStyle();
114+
115+
expect(computedStyle.overflow).toBe("auto");
116+
});
117+
108118
it("should render a hello world", async () => {
109119
const page = await newE2EPage();
110120

‎src/components/markdown-viewer/markdown-viewer.scss‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,18 @@
3737
text-align: end;
3838
}
3939

40+
blockquote {
41+
margin-inline: 0;
42+
}
43+
44+
hr {
45+
block-size: 1px;
46+
margin: unset;
47+
padding: unset;
48+
border: unset;
49+
background-color: currentColor;
50+
}
51+
4052
ch-code {
4153
--ch-code-indicator-color: var(--ch-markdown-viewer-indicator-color);
4254
--ch-code-inline-size: var(--ch-markdown-viewer-inline-size);

‎src/components/next/data-modeling-item/readme.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
| Property | Attribute | Description | Type | Default |
1111
| ------------------ | -------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
1212
| `actionsVisible` | `actions-visible` | This attribute lets you specify if the actions in the `mode === "add"` are visible. | `boolean` | `true` |
13-
| `captions` | -- | The labels used in the buttons of the items. Important for accessibility. | `{ collection: string; confirm: string; delete: string; cancel: string; ATT: string; ENTITY: string; LEVEL: string; editing: string; adding: string; addNewEntity: string; addNewField: string; edit: string; deleting: string; deleteMode: string; newEntity: string; newField: string; }` | `undefined` |
13+
| `captions` | -- | The labels used in the buttons of the items. Important for accessibility. | `{ collection: string; confirm: string; edit: string; cancel: string; delete: string; ATT: string; ENTITY: string; LEVEL: string; editing: string; adding: string; addNewEntity: string; addNewField: string; deleting: string; deleteMode: string; newEntity: string; newField: string; }` | `undefined` |
1414
| `dataType` | `data-type` | The dataType of the field. | `string` | `""` |
1515
| `disabled` | `disabled` | This attribute lets you specify if the element is disabled. If disabled, it will not fire any user interaction related event. | `boolean` | `false` |
1616
| `entityNameToATTs` | -- | This property maps entities of the current dataModel with their corresponding ATTs. | `{ [key: string]: string[]; }` | `{}` |
@@ -118,7 +118,7 @@ Type: `Promise<void>`
118118

119119
### Depends on
120120

121-
- [ch-accordion](../../accordion)
121+
- [ch-accordion](../../../deprecated-components/accordion)
122122

123123
### Graph
124124
```mermaid

‎src/components/next/data-modeling-render/readme.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
| Property | Attribute | Description | Type | Default |
1111
| ---------------------------- | ----------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
1212
| `addingModeCommonClass` | `adding-mode-common-class` | A CSS class to set as the `ch-next-data-modeling-item` element class when adding mode is enabled. | `string` | `undefined` |
13-
| `captions` | -- | The labels used in the buttons of the items. Important for accessibility. | `{ collection: string; confirm: string; delete: string; cancel: string; ATT: string; ENTITY: string; LEVEL: string; editing: string; adding: string; addNewEntity: string; addNewField: string; edit: string; deleting: string; deleteMode: string; newEntity: string; newField: string; }` | `{ ATT: "Attribute", ENTITY: "Entity", LEVEL: "Collection", adding: "Adding...", addNewEntity: "Add new entity", addNewField: "Add new field", cancel: "Cancel", collection: "Collection", confirm: "Confirm", delete: "Delete", deleteMode: "Confirm delete?", deleting: "Deleting...", edit: "Edit", editing: "Saving...", newEntity: "New Entity", newField: "New Field" }` |
13+
| `captions` | -- | The labels used in the buttons of the items. Important for accessibility. | `{ collection: string; confirm: string; edit: string; cancel: string; delete: string; ATT: string; ENTITY: string; LEVEL: string; editing: string; adding: string; addNewEntity: string; addNewField: string; deleting: string; deleteMode: string; newEntity: string; newField: string; }` | `{ ATT: "Attribute", ENTITY: "Entity", LEVEL: "Collection", adding: "Adding...", addNewEntity: "Add new entity", addNewField: "Add new field", cancel: "Cancel", collection: "Collection", confirm: "Confirm", delete: "Delete", deleteMode: "Confirm delete?", deleting: "Deleting...", edit: "Edit", editing: "Saving...", newEntity: "New Entity", newField: "New Field" }` |
1414
| `commonClass` | `common-class` | A CSS class to set as the `ch-next-data-modeling-item` element class. | `string` | `undefined` |
1515
| `createGxCollectionCallback` | -- | This callback is used to created a new SDT GxCollectionField based on the EntityItem type. | `() => EntityItem[]` | `undefined` |
1616
| `cssClass` | `css-class` | A CSS class to set as the `ch-next-data-modeling` element class. | `string` | `undefined` |

‎src/components/theme/tests/theme.e2e.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ describe("[ch-theme]", () => {
2424
await page.setContent(`<ch-theme></ch-theme>`);
2525
const themeRef = await page.find("ch-theme");
2626

27-
expect(themeRef.shadowRoot).toBe(null);
27+
expect(themeRef.shadowRoot).toBeNull();
2828
});
2929

3030
it("should hide the root node if avoidFlashOfUnstyledContent is set", async () => {
@@ -204,4 +204,8 @@ describe("[ch-theme]", () => {
204204
it.skip("should reuse the stylesheet defined by another ch-theme", async () => {
205205
// TODO: Add implementation
206206
});
207+
208+
it.skip("should not duplicate the stylesheet adoption when another ch-theme loads the same CSS", async () => {
209+
// TODO: Add implementation
210+
});
207211
});

0 commit comments

Comments
 (0)