Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix helpers Chart type #12012

Merged
merged 1 commit into from
Jan 30, 2025
Merged

Fix helpers Chart type #12012

merged 1 commit into from
Jan 30, 2025
+18 −15

Conversation

joshkel
Copy link
Contributor

@joshkel joshkel commented Jan 29, 2025

helpers.dom.ts functions referenced the internal Chart JavaScript class rather than the published Chart<TType, TData, TLabel> TypeScript definition. This causes errors when outside code tries to call helper functions.

The two Chart interfaces are incompatible - the width, height, and currentDevicePixelRatio properties are declared as readonly in the TS declaration but are manipulated by helpers.dom.ts functions, and helpers.dom.ts functions need to be invoked both by internal Chart.js code (which uses the JS class) and by outside code (which uses the TS types). To address this, I'm importing the JS version as PrivateChart. There may be a better solution.

It's my understanding that the comment about "typedefs are auto-exported" is obsolete now that helpers.dom is a native TS file.

Fixes #11153

@joshkel
Fix helpers Chart type
Loading
Loading status checks…
598ce2a 
helpers.dom.ts functions referenced the internal `Chart` JavaScript class rather than the published `Chart<TType, TData, TLabel>` TypeScript definition. This causes errors when outside code tries to call helper functions.

The two `Chart` interfaces are incompatible - the `width`, `height`, and `currentDevicePixelRatio` properties are declared as readonly in the TS declaration but are manipulated by helpers.dom.ts functions, and helpers.dom.ts functions need to be invoked both by internal Chart.js code (which uses the JS class) and by outside code (which uses the TS types). To address this, I'm importing the JS version as `PrivateChart`. There may be a better solution.

It's my understanding that the comment about "typedefs are auto-exported" is obsolete now that helpers.dom is a native TS file.

Fixes chartjs#11153
@etimberg etimberg added type: bug type: types Typescript type changes labels Jan 29, 2025
@etimberg etimberg added this to the Version 4.4.8 milestone Jan 29, 2025
@LeeLenaleee LeeLenaleee merged commit 370f6c3 into chartjs:master Jan 30, 2025
7 checks passed
@joshkel joshkel deleted the helper-type-fixes branch January 30, 2025 14:04
joshkel added a commit to joshkel/chartjs-plugin-zoom that referenced this pull request Feb 19, 2025
@joshkel
Update Chart.js and simplify types
57e1da0 
Now that chartjs/Chart.js#12012 has been fixed, these `as any` casts are no longer needed.
@joshkel joshkel mentioned this pull request Feb 19, 2025
Open
DawoudIO added a commit to ChurchCRM/CRM that referenced this pull request Mar 22, 2025
@DawoudIO
[Snyk] Upgrade chart.js from 4.4.7 to 4.4.8 (#7291)
Loading
Loading status checks…
d7d7ac0 
![snyk-top-banner](https://redirect.github.com/andygongea/OWASP-Benchmark/assets/818805/c518c423-16fe-447e-b67f-ad5a49b5d123)


<h3>Snyk has created this PR to upgrade chart.js from 4.4.7 to
4.4.8.</h3>

:information_source: Keep your dependencies up-to-date. This makes it
easier to fix existing vulnerabilities and to more quickly identify and
fix newly disclosed vulnerabilities when they affect your project.

<hr/>


- The recommended version is **1 version** ahead of your current
version.

- The recommended version was released **a month ago**.



<details>
<summary><b>Release notes</b></summary>
<br/>
  <details>
    <summary>Package name: <b>chart.js</b></summary>
    <ul>
      <li>
<b>4.4.8</b> - <a
href="https://redirect.github.com/chartjs/Chart.js/releases/tag/v4.4.8">2025-02-19</a></br><h1>Essential
Links</h1>
<ul>
<li><a href="https://www.npmjs.com/package/chart.js"
rel="nofollow">npm</a></li>
<li><a
href="https://www.chartjs.org/docs/4.4.8/migration/v4-migration.html"
rel="nofollow">Migration guide</a></li>
<li><a href="https://www.chartjs.org/docs/4.4.8/"
rel="nofollow">Docs</a></li>
<li><a href="https://www.chartjs.org/docs/4.4.8/api/"
rel="nofollow">API</a></li>
<li><a
href="https://www.chartjs.org/docs/4.4.8/samples/information.html"
rel="nofollow">Samples</a></li>
</ul>
<ul>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2855725721" data-permission-text="Title is private"
data-url="chartjs/Chart.js#12034"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/12034/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/12034">#12034</a>
[fix] Handle non-primitives in isNumber</li>
</ul>
<h2>Bugs Fixed</h2>
<ul>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2861287106" data-permission-text="Title is private"
data-url="chartjs/Chart.js#12035"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/12035/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/12035">#12035</a>
Export ...ParsedData interfaces</li>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2818663010" data-permission-text="Title is private"
data-url="chartjs/Chart.js#12012"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/12012/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/12012">#12012</a>
Fix helpers `Chart` type</li>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2769020679" data-permission-text="Title is private"
data-url="chartjs/Chart.js#11991"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/11991/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/11991">#11991</a>
Bugfix: TypeError in Interaction due to out-of-bounds index</li>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2766632066" data-permission-text="Title is private"
data-url="chartjs/Chart.js#11986"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/11986/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/11986">#11986</a>
Bugfix: return nearest non-null point on interaction when
spanGaps=true</li>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2765297811" data-permission-text="Title is private"
data-url="chartjs/Chart.js#11984"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/11984/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/11984">#11984</a>
Bugfix: span gaps over null values beyond scale limits</li>
</ul>
<h2>Types</h2>
<ul>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2861287106" data-permission-text="Title is private"
data-url="chartjs/Chart.js#12035"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/12035/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/12035">#12035</a>
Export ...ParsedData interfaces</li>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2818663010" data-permission-text="Title is private"
data-url="chartjs/Chart.js#12012"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/12012/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/12012">#12012</a>
Fix helpers `Chart` type</li>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2817152604" data-permission-text="Title is private"
data-url="chartjs/Chart.js#12010"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/12010/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/12010">#12010</a>
Type fixes for time adapters</li>
</ul>
<h2>Documentation</h2>
<ul>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2800752619" data-permission-text="Title is private"
data-url="chartjs/Chart.js#12005"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/12005/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/12005">#12005</a>
Correct broken link in animations.md</li>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2783665947" data-permission-text="Title is private"
data-url="chartjs/Chart.js#11997"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/11997/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/11997">#11997</a>
Update linear-step-size.md</li>
</ul>
<h2>Development</h2>
<ul>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2861299890" data-permission-text="Title is private"
data-url="chartjs/Chart.js#12036"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/12036/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/12036">#12036</a>
chore: bump to v4.4.8</li>
</ul>
<p>Thanks to <a class="user-mention notranslate"
data-hovercard-type="user"
data-hovercard-url="/users/etimberg/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/etimberg">@ etimberg</a>, <a
class="user-mention notranslate" data-hovercard-type="user"
data-hovercard-url="/users/joshkel/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/joshkel">@ joshkel</a>, <a
class="user-mention notranslate" data-hovercard-type="user"
data-hovercard-url="/users/marisst/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/marisst">@ marisst</a>, <a
class="user-mention notranslate" data-hovercard-type="user"
data-hovercard-url="/users/pensono/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/pensono">@ pensono</a> and <a
class="user-mention notranslate" data-hovercard-type="user"
data-hovercard-url="/users/prems51/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/prems51">@ prems51</a></p>
      </li>
      <li>
<b>4.4.7</b> - <a
href="https://redirect.github.com/chartjs/Chart.js/releases/tag/v4.4.7">2024-12-01</a></br><h1>Essential
Links</h1>
<ul>
<li><a href="https://www.npmjs.com/package/chart.js"
rel="nofollow">npm</a></li>
<li><a
href="https://www.chartjs.org/docs/4.4.7/migration/v4-migration.html"
rel="nofollow">Migration guide</a></li>
<li><a href="https://www.chartjs.org/docs/4.4.7/"
rel="nofollow">Docs</a></li>
<li><a href="https://www.chartjs.org/docs/4.4.7/api/"
rel="nofollow">API</a></li>
<li><a
href="https://www.chartjs.org/docs/4.4.7/samples/information.html"
rel="nofollow">Samples</a></li>
</ul>
<h2>Types</h2>
<ul>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="1917908007" data-permission-text="Title is private"
data-url="chartjs/Chart.js#11521"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/11521/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/11521">#11521</a>
fix: correct typing for doughnut, pie, and polarArea charts</li>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2632473374" data-permission-text="Title is private"
data-url="chartjs/Chart.js#11948"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/11948/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/11948">#11948</a>
Export TRBL from geometric</li>
</ul>
<h2>Documentation</h2>
<ul>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2707355372" data-permission-text="Title is private"
data-url="chartjs/Chart.js#11968"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/11968/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/11968">#11968</a>
Add documentation about setting default tooltip fonts</li>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2680807381" data-permission-text="Title is private"
data-url="chartjs/Chart.js#11962"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/11962/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/11962">#11962</a>
Show correct title in multi series pie chart example</li>
</ul>
<h2>Development</h2>
<ul>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2708926592" data-permission-text="Title is private"
data-url="chartjs/Chart.js#11969"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/11969/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/11969">#11969</a>
Chore: bump version to 4.4.7</li>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="2677470818" data-permission-text="Title is private"
data-url="chartjs/Chart.js#11959"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/11959/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/11959">#11959</a>
Bump cross-spawn from 6.0.5 to 6.0.6</li>
<li><a class="issue-link js-issue-link" data-error-text="Failed to load
title" data-id="1897450644" data-permission-text="Title is private"
data-url="chartjs/Chart.js#11501"
data-hovercard-type="pull_request"
data-hovercard-url="/chartjs/Chart.js/pull/11501/hovercard"
href="https://redirect.github.com/chartjs/Chart.js/pull/11501">#11501</a>
Simplify check undefinded</li>
</ul>
<p>Thanks to <a class="user-mention notranslate"
data-hovercard-type="user"
data-hovercard-url="/users/Connormiha/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/Connormiha">@ Connormiha</a>, <a
class="user-mention notranslate" data-hovercard-type="user"
data-hovercard-url="/users/DustinEwan/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/DustinEwan">@ DustinEwan</a>, <a
class="user-mention notranslate" data-hovercard-type="user"
data-hovercard-url="/users/LeeLenaleee/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/LeeLenaleee">@ LeeLenaleee</a>, <a
class="user-mention notranslate" data-hovercard-type="organization"
data-hovercard-url="/orgs/dependabot/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/dependabot">@ dependabot</a> and <a
class="user-mention notranslate" data-hovercard-type="organization"
data-hovercard-url="/orgs/dependabot/hovercard"
data-octo-click="hovercard-link-click"
data-octo-dimensions="link_type:self"
href="https://redirect.github.com/dependabot">@ dependabot</a>[bot]</p>
      </li>
    </ul>
from <a
href="https://redirect.github.com/chartjs/Chart.js/releases">chart.js
GitHub release notes</a>
  </details>
</details>

---

> [!IMPORTANT]
>
> - Check the changes in this PR to ensure they won't cause issues with
your project.
> - This PR was automatically created by Snyk using the credentials of a
real user.

---

**Note:** _You are seeing this because you or someone else with access
to this repository has authorized Snyk to open upgrade PRs._

**For more information:** <img
src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiIyZGQ1MmVmNi0yZTg3LTRiZTgtYjM5OC05MDYyYmFlOTg0NjUiLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjJkZDUyZWY2LTJlODctNGJlOC1iMzk4LTkwNjJiYWU5ODQ2NSJ9fQ=="
width="0" height="0"/>

> - 🧐 [View latest project
report](https://app.snyk.io/org/dawoudio/project/e27b08aa-e5d2-4b10-8303-630a69d0b669?utm_source&#x3D;github&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 📜 [Customise PR
templates](https://docs.snyk.io/scan-using-snyk/pull-requests/snyk-fix-pull-or-merge-requests/customize-pr-templates?utm_source=&utm_content=fix-pr-template)
> - 🛠 [Adjust upgrade PR
settings](https://app.snyk.io/org/dawoudio/project/e27b08aa-e5d2-4b10-8303-630a69d0b669/settings/integration?utm_source&#x3D;github&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr)
> - 🔕 [Ignore this dependency or unsubscribe from future upgrade
PRs](https://app.snyk.io/org/dawoudio/project/e27b08aa-e5d2-4b10-8303-630a69d0b669/settings/integration?pkg&#x3D;chart.js&amp;utm_source&#x3D;github&amp;utm_medium&#x3D;referral&amp;page&#x3D;upgrade-pr#auto-dep-upgrades)

[//]: #
'snyk:metadata:{"customTemplate":{"variablesUsed":[],"fieldsUsed":[]},"dependencies":[{"name":"chart.js","from":"4.4.7","to":"4.4.8"}],"env":"prod","hasFixes":false,"isBreakingChange":false,"isMajorUpgrade":false,"issuesToFix":[],"prId":"2dd52ef6-2e87-4be8-b398-9062bae98465","prPublicId":"2dd52ef6-2e87-4be8-b398-9062bae98465","packageManager":"npm","priorityScoreList":[],"projectPublicId":"e27b08aa-e5d2-4b10-8303-630a69d0b669","projectUrl":"https://app.snyk.io/org/dawoudio/project/e27b08aa-e5d2-4b10-8303-630a69d0b669?utm_source=github&utm_medium=referral&page=upgrade-pr","prType":"upgrade","templateFieldSources":{"branchName":"default","commitMessage":"default","description":"default","title":"default"},"templateVariants":[],"type":"auto","upgrade":[],"upgradeInfo":{"versionsDiff":1,"publishedDate":"2025-02-19T15:48:26.514Z"},"vulns":[]}'
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@etimberg etimberg

@kurkle kurkle

@LeeLenaleee LeeLenaleee

Assignees
No one assigned
Labels
type: bug type: types Typescript type changes
Projects
None yet
Milestone
Version 4.4.8
Development

Successfully merging this pull request may close these issues.

TypeScript: chartHelpers.getRelativePosition(new Event(''), new Chart()) doesn't pass
4 participants
@joshkel @etimberg @kurkle @LeeLenaleee