diff --git a/.github/workflows/build-docs.yml b/.github/workflows/build-docs.yml
index 152b177ae9..acfb1887e9 100644
--- a/.github/workflows/build-docs.yml
+++ b/.github/workflows/build-docs.yml
@@ -16,12 +16,12 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Checkout
- uses: actions/checkout@v3
+ uses: actions/checkout@v4
- uses: pnpm/action-setup@v2
- name: Setup Node.js
- uses: actions/setup-node@v3
+ uses: actions/setup-node@v4
with:
cache: pnpm
node-version: 18
@@ -29,7 +29,7 @@ jobs:
- name: Install Packages
run: pnpm install --frozen-lockfile
- - name: Verify release verion
+ - name: Verify release version
if: ${{ github.event_name == 'push' && (github.ref == 'refs/heads/master' || startsWith(github.ref, 'refs/heads/release')) }}
run: pnpm --filter mermaid run docs:verify-version
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index eeb557ebb9..605dea9ab3 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -19,13 +19,13 @@ jobs:
matrix:
node-version: [18.x]
steps:
- - uses: actions/checkout@v3
+ - uses: actions/checkout@v4
- uses: pnpm/action-setup@v2
# uses version from "packageManager" field in package.json
- name: Setup Node.js ${{ matrix.node-version }}
- uses: actions/setup-node@v3
+ uses: actions/setup-node@v4
with:
cache: pnpm
node-version: ${{ matrix.node-version }}
diff --git a/.github/workflows/check-readme-in-sync.yml b/.github/workflows/check-readme-in-sync.yml
index 5a8ca319b2..ad6df66b50 100644
--- a/.github/workflows/check-readme-in-sync.yml
+++ b/.github/workflows/check-readme-in-sync.yml
@@ -18,7 +18,7 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Checkout repository
- uses: actions/checkout@v3
+ uses: actions/checkout@v4
- name: Check for difference in README.md and docs/README.md
run: |
diff --git a/.github/workflows/checks.yml b/.github/workflows/checks.yml
index 9f9f316c40..012fbf19d5 100644
--- a/.github/workflows/checks.yml
+++ b/.github/workflows/checks.yml
@@ -15,7 +15,7 @@ jobs:
name: check tests
if: github.repository_owner == 'mermaid-js'
steps:
- - uses: actions/checkout@v3
+ - uses: actions/checkout@v4
with:
fetch-depth: 0
- uses: testomatio/check-tests@stable
diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml
index 26cb2db268..f8c50f47fa 100644
--- a/.github/workflows/codeql.yml
+++ b/.github/workflows/codeql.yml
@@ -29,7 +29,7 @@ jobs:
steps:
- name: Checkout repository
- uses: actions/checkout@v3
+ uses: actions/checkout@v4
# Initializes the CodeQL tools for scanning.
- name: Initialize CodeQL
diff --git a/.github/workflows/dependency-review.yml b/.github/workflows/dependency-review.yml
index 34b14c395b..4e75197790 100644
--- a/.github/workflows/dependency-review.yml
+++ b/.github/workflows/dependency-review.yml
@@ -1,6 +1,6 @@
# Dependency Review Action
#
-# This Action will scan dependency manifest files that change as part of a Pull Reqest, surfacing known-vulnerable versions of the packages declared or updated in the PR. Once installed, if the workflow run is marked as required, PRs introducing known-vulnerable packages will be blocked from merging.
+# This Action will scan dependency manifest files that change as part of a Pull Request, surfacing known-vulnerable versions of the packages declared or updated in the PR. Once installed, if the workflow run is marked as required, PRs introducing known-vulnerable packages will be blocked from merging.
#
# Source repository: https://github.com/actions/dependency-review-action
# Public documentation: https://docs.github.com/en/code-security/supply-chain-security/understanding-your-software-supply-chain/about-dependency-review#dependency-review-enforcement
@@ -15,6 +15,6 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: 'Checkout Repository'
- uses: actions/checkout@v3
+ uses: actions/checkout@v4
- name: 'Dependency Review'
uses: actions/dependency-review-action@v3
diff --git a/.github/workflows/e2e-applitools.yml b/.github/workflows/e2e-applitools.yml
index 5b19431421..543fb5dbb4 100644
--- a/.github/workflows/e2e-applitools.yml
+++ b/.github/workflows/e2e-applitools.yml
@@ -30,13 +30,13 @@ jobs:
run: |
echo "::error,title=Not using Applitols::APPLITOOLS_API_KEY is empty, disabling Applitools for this run."
- - uses: actions/checkout@v3
+ - uses: actions/checkout@v4
- uses: pnpm/action-setup@v2
# uses version from "packageManager" field in package.json
- name: Setup Node.js ${{ matrix.node-version }}
- uses: actions/setup-node@v3
+ uses: actions/setup-node@v4
with:
node-version: ${{ matrix.node-version }}
diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml
index 3e6966677b..71806a9c46 100644
--- a/.github/workflows/e2e.yml
+++ b/.github/workflows/e2e.yml
@@ -17,13 +17,13 @@ jobs:
node-version: [18.x]
containers: [1, 2, 3, 4]
steps:
- - uses: actions/checkout@v3
+ - uses: actions/checkout@v4
- uses: pnpm/action-setup@v2
# uses version from "packageManager" field in package.json
- name: Setup Node.js ${{ matrix.node-version }}
- uses: actions/setup-node@v3
+ uses: actions/setup-node@v4
with:
node-version: ${{ matrix.node-version }}
diff --git a/.github/workflows/link-checker.yml b/.github/workflows/link-checker.yml
index 70580bfff1..c3e2ee44fe 100644
--- a/.github/workflows/link-checker.yml
+++ b/.github/workflows/link-checker.yml
@@ -26,7 +26,7 @@ jobs:
# lychee only uses the GITHUB_TOKEN to avoid rate-limiting
contents: read
steps:
- - uses: actions/checkout@v3
+ - uses: actions/checkout@v4
- name: Restore lychee cache
uses: actions/cache@v3
diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml
index f59c8af31d..f0c5560a1e 100644
--- a/.github/workflows/lint.yml
+++ b/.github/workflows/lint.yml
@@ -20,13 +20,13 @@ jobs:
matrix:
node-version: [18.x]
steps:
- - uses: actions/checkout@v3
+ - uses: actions/checkout@v4
- uses: pnpm/action-setup@v2
# uses version from "packageManager" field in package.json
- name: Setup Node.js ${{ matrix.node-version }}
- uses: actions/setup-node@v3
+ uses: actions/setup-node@v4
with:
cache: pnpm
node-version: ${{ matrix.node-version }}
diff --git a/.github/workflows/publish-docs.yml b/.github/workflows/publish-docs.yml
index f63e587502..05cd68aff1 100644
--- a/.github/workflows/publish-docs.yml
+++ b/.github/workflows/publish-docs.yml
@@ -23,12 +23,12 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Checkout
- uses: actions/checkout@v3
+ uses: actions/checkout@v4
- uses: pnpm/action-setup@v2
- name: Setup Node.js
- uses: actions/setup-node@v3
+ uses: actions/setup-node@v4
with:
cache: pnpm
node-version: 18
diff --git a/.github/workflows/release-preview-publish.yml b/.github/workflows/release-preview-publish.yml
index 221e3836ee..c6503847d9 100644
--- a/.github/workflows/release-preview-publish.yml
+++ b/.github/workflows/release-preview-publish.yml
@@ -9,14 +9,14 @@ jobs:
publish-preview:
runs-on: ubuntu-latest
steps:
- - uses: actions/checkout@v3
+ - uses: actions/checkout@v4
with:
fetch-depth: 0
- uses: pnpm/action-setup@v2
- name: Setup Node.js
- uses: actions/setup-node@v3
+ uses: actions/setup-node@v4
with:
cache: pnpm
node-version: 18.x
diff --git a/.github/workflows/release-publish.yml b/.github/workflows/release-publish.yml
index eb28fe9c8d..69ef749402 100644
--- a/.github/workflows/release-publish.yml
+++ b/.github/workflows/release-publish.yml
@@ -8,14 +8,14 @@ jobs:
publish:
runs-on: ubuntu-latest
steps:
- - uses: actions/checkout@v3
+ - uses: actions/checkout@v4
- uses: fregante/setup-git-user@v2
- uses: pnpm/action-setup@v2
# uses version from "packageManager" field in package.json
- name: Setup Node.js v18
- uses: actions/setup-node@v3
+ uses: actions/setup-node@v4
with:
cache: pnpm
node-version: 18.x
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
index 7c32795e8d..a18b31c9cd 100644
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -12,13 +12,13 @@ jobs:
matrix:
node-version: [18.x]
steps:
- - uses: actions/checkout@v3
+ - uses: actions/checkout@v4
- uses: pnpm/action-setup@v2
# uses version from "packageManager" field in package.json
- name: Setup Node.js ${{ matrix.node-version }}
- uses: actions/setup-node@v3
+ uses: actions/setup-node@v4
with:
cache: pnpm
node-version: ${{ matrix.node-version }}
diff --git a/.github/workflows/update-browserlist.yml b/.github/workflows/update-browserlist.yml
index 813a400b36..0a83df795d 100644
--- a/.github/workflows/update-browserlist.yml
+++ b/.github/workflows/update-browserlist.yml
@@ -8,7 +8,7 @@ jobs:
update-browser-list:
runs-on: ubuntu-latest
steps:
- - uses: actions/checkout@v3
+ - uses: actions/checkout@v4
- run: npx browserslist@latest --update-db
- name: Commit changes
uses: EndBug/add-and-commit@v9
diff --git a/.vite/jsonSchemaPlugin.ts b/.vite/jsonSchemaPlugin.ts
index 671a9612e8..ad3d9863dc 100644
--- a/.vite/jsonSchemaPlugin.ts
+++ b/.vite/jsonSchemaPlugin.ts
@@ -18,6 +18,7 @@ const MERMAID_CONFIG_DIAGRAM_KEYS = [
'er',
'pie',
'quadrantChart',
+ 'xyChart',
'requirement',
'mindmap',
'timeline',
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7552efa3b7..ede5e19ad6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -68,7 +68,7 @@ try {
### Init deprecated and InitThrowsErrors removed
-The config passed to `init` was not being used eariler.
+The config passed to `init` was not being used earlier.
It will now be used.
The `init` function is deprecated and will be removed in the next major release.
init currently works as a wrapper to `initialize` and `run`.
@@ -195,7 +195,7 @@ mermaid.run({
- "Cannot activate" in sequenceDiagram [\#647](https://github.com/knsv/mermaid/issues/647)
- Link \("click" statement\) in flowchart does not work in exported SVG [\#646](https://github.com/knsv/mermaid/issues/646)
- How to pass styling [\#639](https://github.com/knsv/mermaid/issues/639)
-- The live editor cant show seq diagram with notes for 8.0.0-alpha.3 [\#638](https://github.com/knsv/mermaid/issues/638)
+- The live editor can't show seq diagram with notes for 8.0.0-alpha.3 [\#638](https://github.com/knsv/mermaid/issues/638)
- import mermaid.css with ES6 + NPM [\#634](https://github.com/knsv/mermaid/issues/634)
- Actor line cuts through other elements [\#633](https://github.com/knsv/mermaid/issues/633)
- Graph TD line out of the picture \(left side\) [\#630](https://github.com/knsv/mermaid/issues/630)
@@ -504,7 +504,7 @@ mermaid.run({
- Docs css: code hard to read [\#324](https://github.com/knsv/mermaid/issues/324)
- About Markpad integration [\#323](https://github.com/knsv/mermaid/issues/323)
-- How to link backwords in flowchat? [\#321](https://github.com/knsv/mermaid/issues/321)
+- How to link backwards in flowchat? [\#321](https://github.com/knsv/mermaid/issues/321)
- Help with editor [\#310](https://github.com/knsv/mermaid/issues/310)
- +1 [\#293](https://github.com/knsv/mermaid/issues/293)
- Basic chart does not render on Chome, but does in Firefox [\#290](https://github.com/knsv/mermaid/issues/290)
@@ -619,7 +619,7 @@ mermaid.run({
- render to png from the cli does not display the marker-end arrow heads [\#181](https://github.com/knsv/mermaid/issues/181)
- Links in sequence diagrams [\#159](https://github.com/knsv/mermaid/issues/159)
- comment characters `%%` cause parse error [\#141](https://github.com/knsv/mermaid/issues/141)
-- Add a reversed assymetric shape [\#124](https://github.com/knsv/mermaid/issues/124)
+- Add a reversed asymmetric shape [\#124](https://github.com/knsv/mermaid/issues/124)
- Add syntax for double headed arrows [\#123](https://github.com/knsv/mermaid/issues/123)
- Support for font-awesome [\#49](https://github.com/knsv/mermaid/issues/49)
@@ -659,7 +659,7 @@ mermaid.run({
- Auto linewrap for notes in sequence diagrams [\#178](https://github.com/knsv/mermaid/issues/178)
- Execute code after initialize [\#176](https://github.com/knsv/mermaid/issues/176)
- Autoscaling for all diagram types [\#175](https://github.com/knsv/mermaid/issues/175)
-- Problem wit click event callback [\#174](https://github.com/knsv/mermaid/issues/174)
+- Problem with click event callback [\#174](https://github.com/knsv/mermaid/issues/174)
- How to escape characters? [\#170](https://github.com/knsv/mermaid/issues/170)
- it can not work [\#167](https://github.com/knsv/mermaid/issues/167)
- UML Class diagram [\#154](https://github.com/knsv/mermaid/issues/154)
@@ -762,7 +762,7 @@ mermaid.run({
- subgraph background is black in rendered flowchart PNG via CLI [\#121](https://github.com/knsv/mermaid/issues/121)
- Integrate editor at https://github.com/naseer/mermaid-webapp [\#110](https://github.com/knsv/mermaid/issues/110)
- Internet Explorer Support [\#99](https://github.com/knsv/mermaid/issues/99)
-- Assymetric shapes not documented [\#82](https://github.com/knsv/mermaid/issues/82)
+- Asymmetric shapes not documented [\#82](https://github.com/knsv/mermaid/issues/82)
- NoModificationAllowedError [\#23](https://github.com/knsv/mermaid/issues/23)
- Improve arrows [\#3](https://github.com/knsv/mermaid/issues/3)
@@ -908,7 +908,7 @@ mermaid.run({
- Question marks don't render properly with /dist/mermaid.full.min.js [\#30](https://github.com/knsv/mermaid/issues/30)
- Error with some characters [\#25](https://github.com/knsv/mermaid/issues/25)
-- Provide parse function in browser widthout `require`? [\#21](https://github.com/knsv/mermaid/issues/21)
+- Provide parse function in browser without `require`? [\#21](https://github.com/knsv/mermaid/issues/21)
- Better label text support [\#18](https://github.com/knsv/mermaid/issues/18)
- Cap-cased words break parser [\#8](https://github.com/knsv/mermaid/issues/8)
diff --git a/README.md b/README.md
index 99e3b29c22..cf21fdb8e6 100644
--- a/README.md
+++ b/README.md
@@ -34,7 +34,7 @@ Try Live Editor previews of future releases:
@@ -44,6 +44,22 @@ Try Live Editor previews of future releases:
+## Table of content
+
+Expand contents
+
+- [About](#about)
+- [Examples](#examples)
+- [Release](#release)
+- [Related projects](#related-projects)
+- [Contributors](#contributors)
+- [Security and safe diagrams](#security-and-safe-diagrams)
+- [Reporting vulnerabilities](#reporting-vulnerabilities)
+- [Appreciation](#appreciation)
+
+
Mermaid allows even non-programmers to easily create detailed diagrams through the [Mermaid Live Editor](https://mermaid.live/).
-[Tutorials](./docs/config/Tutorials.md) has video tutorials.
-Use Mermaid with your favorite applications, check out the list of [Integrations and Usages of Mermaid](./docs/ecosystem/integrations.md).
+For video tutorials, visit our [Tutorials](./docs/config/Tutorials.md) page.
+Use Mermaid with your favorite applications, check out the list of [Integrations and Usages of Mermaid](./docs/ecosystem/integrations-community.md).
-You can also use Mermaid within [GitHub](https://github.blog/2022-02-14-include-diagrams-markdown-files-mermaid/) as well many of your other favorite applications—check out the list of [Integrations and Usages of Mermaid](./docs/ecosystem/integrations.md).
+You can also use Mermaid within [GitHub](https://github.blog/2022-02-14-include-diagrams-markdown-files-mermaid/) as well many of your other favorite applications—check out the list of [Integrations and Usages of Mermaid](./docs/ecosystem/integrations-community.md).
For a more detailed introduction to Mermaid and some of its more basic uses, look to the [Beginner's Guide](./docs/intro/getting-started.md), [Usage](./docs/config/usage.md) and [Tutorials](./docs/config/Tutorials.md).
diff --git a/README.zh-CN.md b/README.zh-CN.md
index 31eb5b1cae..98975ea331 100644
--- a/README.zh-CN.md
+++ b/README.zh-CN.md
@@ -35,7 +35,7 @@ Mermaid
[![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid)
[![NPM Downloads](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid)
[![Join our Slack!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=slack&label=slack)](https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE)
-[![Twitter Follow](https://img.shields.io/badge/Social-mermaidjs__-blue?style=social&logo=twitter)](https://twitter.com/mermaidjs_)
+[![Twitter Follow](https://img.shields.io/badge/Social-mermaidjs__-blue?style=social&logo=X)](https://twitter.com/mermaidjs_)
@@ -57,7 +57,7 @@ Mermaid 是一个基于 Javascript 的图表绘制工具,通过解析类 Markd
Mermaid 通过允许用户创建便于修改的图表来解决这一难题,它也可以作为生产脚本(或其他代码)的一部分。
Mermaid 甚至能让非程序员也能通过 [Mermaid Live Editor](https://mermaid.live/) 轻松创建详细的图表。
-你可以访问 [教程](./docs/config/Tutorials.md) 来查看 Live Editor 的视频教程,也可以查看 [Mermaid 的集成和使用](./docs/ecosystem/integrations.md) 这个清单来检查你的文档工具是否已经集成了 Mermaid 支持。
+你可以访问 [教程](./docs/config/Tutorials.md) 来查看 Live Editor 的视频教程,也可以查看 [Mermaid 的集成和使用](./docs/ecosystem/integrations-community.md) 这个清单来检查你的文档工具是否已经集成了 Mermaid 支持。
如果想要查看关于 Mermaid 更详细的介绍及基础使用方式,可以查看 [入门指引](./docs/intro/getting-started.md), [用法](./docs/config/usage.md) 和 [教程](./docs/config/Tutorials.md).
diff --git a/cSpell.json b/cSpell.json
index e67c7d48e6..76f395915f 100644
--- a/cSpell.json
+++ b/cSpell.json
@@ -156,6 +156,7 @@
"vitepress",
"vueuse",
"xlink",
+ "xychart",
"yash",
"yokozuna",
"zenuml",
diff --git a/cypress/integration/other/xss.spec.js b/cypress/integration/other/xss.spec.js
index fa4ca4fc80..678040f98a 100644
--- a/cypress/integration/other/xss.spec.js
+++ b/cypress/integration/other/xss.spec.js
@@ -132,4 +132,9 @@ describe('XSS', () => {
cy.wait(1000);
cy.get('#the-malware').should('not.exist');
});
+ it('should sanitize backticks in class names properly', () => {
+ cy.visit('http://localhost:9000/xss24.html');
+ cy.wait(1000);
+ cy.get('#the-malware').should('not.exist');
+ });
});
diff --git a/cypress/integration/rendering/classDiagram.spec.js b/cypress/integration/rendering/classDiagram.spec.js
index a23430b083..cab3649df4 100644
--- a/cypress/integration/rendering/classDiagram.spec.js
+++ b/cypress/integration/rendering/classDiagram.spec.js
@@ -501,4 +501,16 @@ describe('Class diagram', () => {
B : -methods()
`);
});
+
+ it('should handle notes with anchor tag having target attribute', () => {
+ renderGraph(
+ `classDiagram
+ class test { }
+ note for test "note about mermaid
"`
+ );
+
+ cy.get('svg').then((svg) => {
+ cy.get('a').should('have.attr', 'target', '_blank').should('have.attr', 'rel', 'noopener');
+ });
+ });
});
diff --git a/cypress/integration/rendering/gantt.spec.js b/cypress/integration/rendering/gantt.spec.js
index 7c16909522..998a092c24 100644
--- a/cypress/integration/rendering/gantt.spec.js
+++ b/cypress/integration/rendering/gantt.spec.js
@@ -520,6 +520,32 @@ describe('Gantt diagram', () => {
);
});
+ // TODO: fix it
+ //
+ // This test is skipped deliberately
+ // because it fails and blocks our development pipeline
+ // It was added as an attempt to fix gantt performance issues
+ //
+ // https://github.com/mermaid-js/mermaid/issues/3274
+ //
+ it.skip('should render a gantt diagram with very large intervals, skipping excludes if interval > 5 years', () => {
+ imgSnapshotTest(
+ `gantt
+ title A long Gantt Diagram
+ dateFormat YYYY-MM-DD
+ axisFormat %m-%d
+ tickInterval 1day
+ excludes weekends
+ section Section
+ A task : a1, 9999-10-01, 30d
+ Another task : after a1, 20d
+ section Another
+ Task in sec : 2022-10-20, 12d
+ another task : 24d
+ `
+ );
+ });
+
it('should render when compact is true', () => {
imgSnapshotTest(
`
diff --git a/cypress/integration/rendering/gitGraph.spec.js b/cypress/integration/rendering/gitGraph.spec.js
index c01a557961..9f040a36f0 100644
--- a/cypress/integration/rendering/gitGraph.spec.js
+++ b/cypress/integration/rendering/gitGraph.spec.js
@@ -26,7 +26,7 @@ describe('Git Graph diagram', () => {
`gitGraph
commit id: "Normal Commit"
commit id: "Reverse Commit" type: REVERSE
- commit id: "Hightlight Commit" type: HIGHLIGHT
+ commit id: "Highlight Commit" type: HIGHLIGHT
`,
{}
);
@@ -36,7 +36,7 @@ describe('Git Graph diagram', () => {
`gitGraph
commit id: "Normal Commit with tag" tag: "v1.0.0"
commit id: "Reverse Commit with tag" type: REVERSE tag: "RC_1"
- commit id: "Hightlight Commit" type: HIGHLIGHT tag: "8.8.4"
+ commit id: "Highlight Commit" type: HIGHLIGHT tag: "8.8.4"
`,
{}
);
@@ -102,7 +102,7 @@ describe('Git Graph diagram', () => {
{}
);
});
- it('8: should render a simple gitgraph with more than 8 branchs & overriding variables', () => {
+ it('8: should render a simple gitgraph with more than 8 branches & overriding variables', () => {
imgSnapshotTest(
`%%{init: { 'logLevel': 'debug', 'theme': 'default' , 'themeVariables': {
'gitBranchLabel0': '#ffffff',
@@ -358,7 +358,7 @@ gitGraph
`gitGraph TB:
commit id: "Normal Commit"
commit id: "Reverse Commit" type: REVERSE
- commit id: "Hightlight Commit" type: HIGHLIGHT
+ commit id: "Highlight Commit" type: HIGHLIGHT
`,
{}
);
@@ -368,7 +368,7 @@ gitGraph
`gitGraph TB:
commit id: "Normal Commit with tag" tag: "v1.0.0"
commit id: "Reverse Commit with tag" type: REVERSE tag: "RC_1"
- commit id: "Hightlight Commit" type: HIGHLIGHT tag: "8.8.4"
+ commit id: "Highlight Commit" type: HIGHLIGHT tag: "8.8.4"
`,
{}
);
@@ -434,7 +434,7 @@ gitGraph
{}
);
});
- it('22: should render a simple gitgraph with more than 8 branchs & overriding variables | Vertical Branch', () => {
+ it('22: should render a simple gitgraph with more than 8 branches & overriding variables | Vertical Branch', () => {
imgSnapshotTest(
`%%{init: { 'logLevel': 'debug', 'theme': 'default' , 'themeVariables': {
'gitBranchLabel0': '#ffffff',
diff --git a/cypress/integration/rendering/timeline.spec.ts b/cypress/integration/rendering/timeline.spec.ts
index 68da01d503..c748b54d3c 100644
--- a/cypress/integration/rendering/timeline.spec.ts
+++ b/cypress/integration/rendering/timeline.spec.ts
@@ -57,7 +57,7 @@ describe('Timeline diagram', () => {
{}
);
});
- it('5: should render a simple timeline with directive overriden colors', () => {
+ it('5: should render a simple timeline with directive overridden colors', () => {
imgSnapshotTest(
` %%{init: { 'logLevel': 'debug', 'theme': 'default' , 'themeVariables': {
'cScale0': '#ff0000',
diff --git a/cypress/integration/rendering/xyChart.spec.js b/cypress/integration/rendering/xyChart.spec.js
new file mode 100644
index 0000000000..85d998c50b
--- /dev/null
+++ b/cypress/integration/rendering/xyChart.spec.js
@@ -0,0 +1,322 @@
+import { imgSnapshotTest, renderGraph } from '../../helpers/util.ts';
+
+describe('XY Chart', () => {
+ it('should render the simplest possible chart', () => {
+ imgSnapshotTest(
+ `
+ xychart-beta
+ line [10, 30, 20]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Should render a complete chart', () => {
+ imgSnapshotTest(
+ `
+ xychart-beta
+ title "Sales Revenue"
+ x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ y-axis "Revenue (in $)" 4000 --> 11000
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ `,
+ {}
+ );
+ });
+ it('Should render a chart without title', () => {
+ imgSnapshotTest(
+ `
+ xychart-beta
+ x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ y-axis "Revenue (in $)" 4000 --> 11000
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('y-axis title not required', () => {
+ imgSnapshotTest(
+ `
+ xychart-beta
+ x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ y-axis 4000 --> 11000
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Should render a chart without y-axis with different range', () => {
+ imgSnapshotTest(
+ `
+ xychart-beta
+ x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 14000, 3200, 9200, 9900, 3400, 6000]
+ line [2000, 7000, 6500, 9200, 9500, 7500, 11000, 10200, 3200, 8500, 7000, 8800]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('x axis title not required', () => {
+ imgSnapshotTest(
+ `
+ xychart-beta
+ x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 14000, 3200, 9200, 9900, 3400, 6000]
+ line [2000, 7000, 6500, 9200, 9500, 7500, 11000, 10200, 3200, 8500, 7000, 8800]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Multiple plots can be rendered', () => {
+ imgSnapshotTest(
+ `
+ xychart-beta
+ line [23, 46, 77, 34]
+ line [45, 32, 33, 12]
+ bar [87, 54, 99, 85]
+ line [78, 88, 22, 4]
+ line [22, 29, 75, 33]
+ bar [52, 96, 35, 10]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Decimals and negative numbers are supported', () => {
+ imgSnapshotTest(
+ `
+ xychart-beta
+ y-axis -2.4 --> 3.5
+ line [+1.3, .6, 2.4, -.34]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Render spark line with "plotReservedSpacePercent"', () => {
+ imgSnapshotTest(
+ `
+ ---
+ config:
+ theme: dark
+ xyChart:
+ width: 200
+ height: 20
+ plotReservedSpacePercent: 100
+ ---
+ xychart-beta
+ line [5000, 9000, 7500, 6200, 9500, 5500, 11000, 8200, 9200, 9500, 7000, 8800]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Render spark bar without displaying other property', () => {
+ imgSnapshotTest(
+ `
+ ---
+ config:
+ theme: dark
+ xyChart:
+ width: 200
+ height: 20
+ xAxis:
+ showLabel: false
+ showTitle: false
+ showTick: false
+ showAxisLine: false
+ yAxis:
+ showLabel: false
+ showTitle: false
+ showTick: false
+ showAxisLine: false
+ ---
+ xychart-beta
+ bar [5000, 9000, 7500, 6200, 9500, 5500, 11000, 8200, 9200, 9500, 7000, 8800]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Should use all the config from directive', () => {
+ imgSnapshotTest(
+ `
+ %%{init: {"xyChart": {"width": 1000, "height": 600, "titlePadding": 5, "titleFontSize": 10, "xAxis": {"labelFontSize": "20", "labelPadding": 10, "titleFontSize": 30, "titlePadding": 20, "tickLength": 10, "tickWidth": 5}, "yAxis": {"labelFontSize": "20", "labelPadding": 10, "titleFontSize": 30, "titlePadding": 20, "tickLength": 10, "tickWidth": 5}, "plotBorderWidth": 5, "chartOrientation": "horizontal", "plotReservedSpacePercent": 60 }}}%%
+ xychart-beta
+ title "Sales Revenue"
+ x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ y-axis "Revenue (in $)" 4000 --> 11000
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Should use all the config from yaml', () => {
+ imgSnapshotTest(
+ `
+ ---
+ config:
+ theme: forest
+ xyChart:
+ width: 1000
+ height: 600
+ titlePadding: 5
+ titleFontSize: 10
+ xAxis:
+ labelFontSize: 20
+ labelPadding: 10
+ titleFontSize: 30
+ titlePadding: 20
+ tickLength: 10
+ tickWidth: 5
+ axisLineWidth: 5
+ yAxis:
+ labelFontSize: 20
+ labelPadding: 10
+ titleFontSize: 30
+ titlePadding: 20
+ tickLength: 10
+ tickWidth: 5
+ axisLineWidth: 5
+ chartOrientation: horizontal
+ plotReservedSpacePercent: 60
+ ---
+ xychart-beta
+ title "Sales Revenue"
+ x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ y-axis "Revenue (in $)" 4000 --> 11000
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Render with show axis title false', () => {
+ imgSnapshotTest(
+ `
+ ---
+ config:
+ xyChart:
+ xAxis:
+ showTitle: false
+ yAxis:
+ showTitle: false
+ ---
+ xychart-beta
+ title "Sales Revenue"
+ x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ y-axis "Revenue (in $)" 4000 --> 11000
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Render with show axis label false', () => {
+ imgSnapshotTest(
+ `
+ ---
+ config:
+ xyChart:
+ xAxis:
+ showLabel: false
+ yAxis:
+ showLabel: false
+ ---
+ xychart-beta
+ title "Sales Revenue"
+ x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ y-axis "Revenue (in $)" 4000 --> 11000
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Render with show axis tick false', () => {
+ imgSnapshotTest(
+ `
+ ---
+ config:
+ xyChart:
+ xAxis:
+ showTick: false
+ yAxis:
+ showTick: false
+ ---
+ xychart-beta
+ title "Sales Revenue"
+ x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ y-axis "Revenue (in $)" 4000 --> 11000
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Render with show axis line false', () => {
+ imgSnapshotTest(
+ `
+ ---
+ config:
+ xyChart:
+ xAxis:
+ showAxisLine: false
+ yAxis:
+ showAxisLine: false
+ ---
+ xychart-beta
+ title "Sales Revenue"
+ x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ y-axis "Revenue (in $)" 4000 --> 11000
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+ it('Render all the theme color', () => {
+ imgSnapshotTest(
+ `
+ ---
+ config:
+ themeVariables:
+ xyChart:
+ titleColor: "#ff0000"
+ backgroundColor: "#f0f8ff"
+ yAxisLabelColor: "#ee82ee"
+ yAxisTitleColor: "#7fffd4"
+ yAxisTickColor: "#87ceeb"
+ yAxisLineColor: "#ff6347"
+ xAxisLabelColor: "#7fffd4"
+ xAxisTitleColor: "#ee82ee"
+ xAxisTickColor: "#ff6347"
+ xAxisLineColor: "#87ceeb"
+ plotColorPalette: "#008000, #faba63"
+ ---
+ xychart-beta
+ title "Sales Revenue"
+ x-axis Months [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
+ y-axis "Revenue (in $)" 4000 --> 11000
+ bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
+ `,
+ {}
+ );
+ cy.get('svg');
+ });
+});
diff --git a/cypress/platform/knsv2.html b/cypress/platform/knsv2.html
index f9a9f3756d..020ea8b482 100644
--- a/cypress/platform/knsv2.html
+++ b/cypress/platform/knsv2.html
@@ -58,12 +58,21 @@
- flowchart - classDef mainCategories fill:#f9d5e5, stroke:#233d4d,stroke-width:2px, font-weight:bold; - CS(Customer Awareness Journey):::mainCategories --
+flowchart TB + C & D & E & F & G & H & I & J & K & L & M & N & O & P & Q & R & S & T & U & V & W & X & Y & Z & A1 & A2 & A3 & A4 & A5 & A6 & A7 & A8 + ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------> + C & D & E & F & G & H & I & J & K & L & M & N & O & P & Q & R & S & T & U & V & W & X & Y & Z & A1 & A2 & A3 & A4 & A5 & A6 & A7 & A8 + ++
+ flowchart TB + A & A & A & A & A & A & A & A ---> C & D & E & F & G & H & I & J & K & L & M & N & O & P & Q & R & S & T & U & V & W & X & Y & Z ++
+ flowchart TB + A1 & A2 & A3 & A4 & A5 & A6 & A7 & A8 --> C & D & E & F & G & H & I & J & K & L & M & N & O & P & Q & R & S & T & U & V & W & X & Y & Z ++
flowchart Node1:::class1 --> Node2:::class2 Node1:::class1 --> Node3:::class2 @@ -441,6 +450,7 @@ messageFontFamily: 'courier', }, fontSize: 16, + logLevel: 0, }); function callback() { alert('It worked'); diff --git a/cypress/platform/xss10.html b/cypress/platform/xss10.html index 3a8157fed2..79fa97136e 100644 --- a/cypress/platform/xss10.html +++ b/cypress/platform/xss10.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss11.html b/cypress/platform/xss11.html index 302f39ee90..3b505b7411 100644 --- a/cypress/platform/xss11.html +++ b/cypress/platform/xss11.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss12.html b/cypress/platform/xss12.html index b1e2c1d0ab..75059e8af8 100644 --- a/cypress/platform/xss12.html +++ b/cypress/platform/xss12.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss13.html b/cypress/platform/xss13.html index 9f505ea7b8..9ee2a73044 100644 --- a/cypress/platform/xss13.html +++ b/cypress/platform/xss13.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss15.html b/cypress/platform/xss15.html index 3fa6b7151a..bfd3f1652d 100644 --- a/cypress/platform/xss15.html +++ b/cypress/platform/xss15.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss16.html b/cypress/platform/xss16.html index 6f8a734eb6..0b8c0c9f78 100644 --- a/cypress/platform/xss16.html +++ b/cypress/platform/xss16.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss17.html b/cypress/platform/xss17.html index bd7e1c57eb..2a04701264 100644 --- a/cypress/platform/xss17.html +++ b/cypress/platform/xss17.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss18.html b/cypress/platform/xss18.html index ccacfadbb1..df1bee1dd6 100644 --- a/cypress/platform/xss18.html +++ b/cypress/platform/xss18.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss19.html b/cypress/platform/xss19.html index 7966abb8c1..4d7bb6e08b 100644 --- a/cypress/platform/xss19.html +++ b/cypress/platform/xss19.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss20.html b/cypress/platform/xss20.html index f290898b2f..bbe2dd00b8 100644 --- a/cypress/platform/xss20.html +++ b/cypress/platform/xss20.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss21.html b/cypress/platform/xss21.html index 7cfa17c9ee..be7289b7f1 100644 --- a/cypress/platform/xss21.html +++ b/cypress/platform/xss21.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss23-css.html b/cypress/platform/xss23-css.html index cc5b6f0bf7..c4bc43b6a0 100644 --- a/cypress/platform/xss23-css.html +++ b/cypress/platform/xss23-css.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss24.html b/cypress/platform/xss24.html new file mode 100644 index 0000000000..5ca092d657 --- /dev/null +++ b/cypress/platform/xss24.html @@ -0,0 +1,109 @@ + + + + + + + + + + +Security check++ + ++ + + diff --git a/cypress/platform/xss5.html b/cypress/platform/xss5.html index f7abf7a45c..e9855f3f7c 100644 --- a/cypress/platform/xss5.html +++ b/cypress/platform/xss5.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security check@@ -84,14 +94,6 @@ function callback() { alert('It worked'); } - function xssAttack() { - const div = document.createElement('div'); - div.id = 'the-malware'; - div.className = 'malware'; - div.innerHTML = 'XSS Succeeded'; - document.getElementsByTagName('body')[0].appendChild(div); - throw new Error('XSS Succeeded'); - } let diagram = 'graph LR\n'; diagram += 'B-->D("\"\);\n"; diff --git a/cypress/platform/xss6.html b/cypress/platform/xss6.html index 7d7ae18d1b..bf321fc673 100644 --- a/cypress/platform/xss6.html +++ b/cypress/platform/xss6.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss7.html b/cypress/platform/xss7.html index 177b4342ca..36abe7b418 100644 --- a/cypress/platform/xss7.html +++ b/cypress/platform/xss7.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss8.html b/cypress/platform/xss8.html index 5852c2693f..15358b6f07 100644 --- a/cypress/platform/xss8.html +++ b/cypress/platform/xss8.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/cypress/platform/xss9.html b/cypress/platform/xss9.html index cf2ad1359f..a9c652b59b 100644 --- a/cypress/platform/xss9.html +++ b/cypress/platform/xss9.html @@ -42,6 +42,16 @@ font-size: 72px; } +Security checkdiff --git a/demos/c4context.html b/demos/c4context.html index cf358b5501..f674054a2f 100644 --- a/demos/c4context.html +++ b/demos/c4context.html @@ -173,7 +173,7 @@C4 context diagram demos
Container(mobile, "Mobile App", "Xamarin", "Provides a limited subset of the Internet Banking functionality to customers via their mobile device.") } - Deployment_Node(comp, "Customer's computer", "Mircosoft Windows or Apple macOS"){ + Deployment_Node(comp, "Customer's computer", "Microsoft Windows or Apple macOS"){ Deployment_Node(browser, "Web Browser", "Google Chrome, Mozilla Firefox,
Apple Safari or Microsoft Edge"){ Container(spa, "Single Page Application", "JavaScript and Angular", "Provides all of the Internet Banking functionality to customers via their web browser.") } diff --git a/demos/flowchart.html b/demos/flowchart.html index 8389510b28..d7032a663c 100644 --- a/demos/flowchart.html +++ b/demos/flowchart.html @@ -22,7 +22,7 @@graph
--- graph LR accTitle: This is a complicated flow - accDescr: This is the descriptoin for the complicated flow. + accDescr: This is the description for the complicated flow. sid-B3655226-6C29-4D00-B685-3D5C734DC7E1[" diff --git a/demos/index.html b/demos/index.html index 24c4fbf3b0..c634aad2d4 100644 --- a/demos/index.html +++ b/demos/index.html @@ -60,6 +60,9 @@Pie
requirementDiagram - accTitle: Requirments demo in black and white + accTitle: Requirements demo in black and white accDescr: A series of requirement boxes showing relationships among them. Has meaningless task names requirement test_req { diff --git a/demos/sequence.html b/demos/sequence.html index b2733a384e..3345fed17a 100644 --- a/demos/sequence.html +++ b/demos/sequence.html @@ -164,6 +164,13 @@+Sequence diagram demos
end
+ sequenceDiagram + actor Alice + actor John + Alice-xJohn: Hello John, how are you? + John--xAlice: Great! ++ +