alighasami/xyflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feat: dark mode (#3652)

Browse Source 
* feat(react/svelte): add dark mode defaults

* refactor(darkmode): minimap, edges, edge labels

* chore(style): edge label color

* feat(colorMode): add colorMode prop light/dark/system

* chore(examples): cleanup

* test(colorMode): add tests

* chore(base.css): add dark base

* chore(examples): cleanup
This commit is contained in:
Moritz Klack
2023-11-23 12:15:36 +01:00
committed by GitHub
parent 74c82272aa
commit ab5eef220f
38 changed files with 474 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
tests/playwright/e2e/edges.spec.ts
View File

@@ -2,7 +2,7 @@ import { test, expect } from '@playwright/test';
import { FRAMEWORK } from './constants';
test.describe('EDGES', () => {
test.describe('Edges', () => {
test.beforeEach(async ({ page }) => {
// Go to the starting url before each test.
await page.goto('/tests/generic/edges/general');

2
tests/playwright/e2e/node-toolbar.spec.ts
View File

@@ -1,4 +1,4 @@
import { test, expect, Locator } from '@playwright/test';
import { test, expect } from '@playwright/test';
import { FRAMEWORK } from './constants';
type Position = 'top' | 'right' | 'bottom' | 'left';

2
tests/playwright/e2e/nodes.spec.ts
View File

@@ -2,7 +2,7 @@ import { test, expect, Locator } from '@playwright/test';
import { FRAMEWORK } from './constants';
test.describe('NODES', () => {
test.describe('Nodes', () => {
test.beforeEach(async ({ page }) => {
// Go to the starting url before each test.
await page.goto('/tests/generic/nodes/general');

6
tests/playwright/e2e/pane.spec.ts
View File

@@ -3,7 +3,7 @@ import { test, expect } from '@playwright/test';
import { FRAMEWORK } from './constants';
import { getTransform } from './utils';
test.describe('PANE DEFAULT', () => {
test.describe('Pane default', () => {
test.beforeEach(async ({ page }) => {
// Go to the starting url before each test.
await page.goto('/tests/generic/pane/general');
@@ -126,7 +126,7 @@ test.describe('PANE DEFAULT', () => {
});
});
test.describe('PANE NON-DEFAULT', () => {
test.describe('Pane non-default', () => {
test.beforeEach(async ({ page }) => {
// Go to the starting url before each test.
await page.goto('/tests/generic/pane/non-defaults');
@@ -168,7 +168,7 @@ test.describe('PANE NON-DEFAULT', () => {
});
});
test.describe('PANE ACTIVATION KEYS', () => {
test.describe('Pane activation keys', () => {
test.beforeEach(async ({ page }) => {
// Go to the starting url before each test.
await page.goto('/tests/generic/pane/activation-keys');

22
tests/playwright/e2e/props.spec.ts Normal file
View File

@@ -0,0 +1,22 @@
import { test, expect } from '@playwright/test';
import { FRAMEWORK } from './constants';
test.describe('Props', () => {
test.describe('colorMode', async () => {
test('render default light color mode', async ({ page }) => {
await page.goto('/examples/color-mode');
const locator = page.locator(`.${FRAMEWORK}-flow`);
await expect(locator).not.toHaveClass(/dark/);
});
test('render dark color mode', async ({ page }) => {
await page.goto('/examples/color-mode');
const locator = page.locator(`.${FRAMEWORK}-flow`);
await page.getByTestId('colormode-select').selectOption({ label: 'dark' });
await expect(locator).toHaveClass(/dark/);
});
});
});