Pit Friedrich
b341b2ed5d
CI / build-and-test (pull_request) Successful in 2m32s
Chart and KPI numbers were literals in DashboardView, duplicated between the line and bar chart, and only existed at construction time. Add a thin data layer as the seam for later refresh/filter work: - ChartSeries / KpiData records, immutable, carrying translation keys rather than display text so the data layer stays free of a UI locale. - ChartDataService interface plus an in-memory implementation returning the previous hardcoded numbers, so nothing changes visually. - DashboardView injects the service, lays out the KPI tiles from its list (grid ids come from the data, so saved layouts still match), and resolves the keys against the bundle. Also fixes DashboardChartPlaywrightTest, red on main since the KPI tiles landed: it patched the first apex-chart, which is now a sparkline with no xaxis.categories, so the axis-chart patch was a structural change and legitimately redrew the SVG. It now targets an axis chart. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_0124BiJikbhbiEsNfJxdWM69
67 lines
2.7 KiB
Java
67 lines
2.7 KiB
Java
package com.example.e2e;
|
|
|
|
import com.microsoft.playwright.Locator;
|
|
import org.junit.jupiter.api.BeforeEach;
|
|
import org.junit.jupiter.api.Test;
|
|
|
|
import static com.microsoft.playwright.assertions.PlaywrightAssertions.assertThat;
|
|
import static org.junit.jupiter.api.Assertions.assertEquals;
|
|
import static org.junit.jupiter.api.Assertions.assertTrue;
|
|
|
|
/**
|
|
* End-to-end coverage for the incremental update path of {@code apex-chart.ts}:
|
|
* a data update must patch the running ApexCharts instance instead of tearing
|
|
* the chart down and building it again.
|
|
*/
|
|
class DashboardChartPlaywrightTest extends PlaywrightTestBase {
|
|
|
|
private static final String PATCH = """
|
|
{"series":[{"name":"Revenue","data":[1,2,3,4,5,6]}],
|
|
"categories":["Jan","Feb","Mar","Apr","May","Jun"]}""";
|
|
|
|
@BeforeEach
|
|
void openDashboard() {
|
|
navigate("");
|
|
}
|
|
|
|
@Test
|
|
void dataUpdate_keepsTheRenderedSvgInPlace() {
|
|
Locator chart = axisChart();
|
|
assertThat(chart.locator("svg").first()).isVisible();
|
|
|
|
// Tag the live SVG node: a full rebuild would replace it and drop the tag.
|
|
chart.evaluate("el => el.querySelector('svg').dataset.marker = 'first-render'");
|
|
|
|
chart.evaluate("(el, patch) => el.updateData(patch)", PATCH);
|
|
|
|
assertEquals(1, chart.locator("svg[data-marker='first-render']").count(),
|
|
"the chart must be patched in place, not recreated");
|
|
assertEquals("1,2,3,4,5,6",
|
|
chart.evaluate("el => JSON.parse(el.lastOptionsJson).series[0].data.join(',')"),
|
|
"the patched data must have reached the chart");
|
|
}
|
|
|
|
@Test
|
|
void dataUpdate_keepsTheThemeOverlay() {
|
|
Locator chart = axisChart();
|
|
assertThat(chart.locator("svg").first()).isVisible();
|
|
|
|
chart.evaluate("(el, patch) => el.updateData(patch)", PATCH);
|
|
|
|
// grid.borderColor is only ever set by applyThemeOverlay(), from the
|
|
// resolved --dialect-border token — so a resolved rgb() value here means
|
|
// the overlay survived the incremental update.
|
|
Object borderColor = chart.evaluate("el => JSON.parse(el.lastOptionsJson).grid.borderColor");
|
|
assertTrue(String.valueOf(borderColor).startsWith("rgb"),
|
|
"expected a resolved theme color, got: " + borderColor);
|
|
}
|
|
|
|
/** The first chart in the DOM is a KPI sparkline, which has no
|
|
* {@code xaxis.categories} — patching one with categories is a structural
|
|
* change and legitimately redraws. The patch above is an axis-chart patch,
|
|
* so it has to be applied to an axis chart. */
|
|
private Locator axisChart() {
|
|
return page.locator("apex-chart:not(.dialect-sparkline)").first();
|
|
}
|
|
}
|