Skip to content

Crashing <Bar /> tooltip with partitioned border #10488

Description

@lenaka

Expected behavior

I want use tooltips with chart <Bar {...props} /> with single border

Current behavior

Chart is crashed with error if you try to hover on any bar

chart.esm.js:8874 Uncaught TypeError: Cannot convert undefined or null to object
    at valueOf (<anonymous>)
    at _resolveScriptable (helpers.segment.js?:formatted:2116:13)
    at _resolveWithContext (helpers.segment.js?:formatted:2100:17)
    at eval (helpers.segment.js?:formatted:2049:46)
    at _cached (helpers.segment.js?:formatted:2092:19)
    at Object.get (helpers.segment.js?:formatted:2049:20)
    at Tooltip._drawColorBox (chart.esm.js:8874:21)
    at Tooltip.drawBody (chart.esm.js:8942:14)
    at Tooltip.draw (chart.esm.js:9064:12)
    at Object.afterDraw (chart.esm.js:9166:15)

Reproducible sample

https://codesandbox.io/s/restless-https-64qmvw?file=/App.tsx

Optional extra steps/info to reproduce

The reason of crashing is property borderWidth. Usage of number as a value works fine (e.g. borderWith: 2). But as soon as you try to partition border, chart is crashing, e.g

borderWidth: [
  {
    top: 2,
    bottom: 0,
    left: 0,
    right: 0
  }
]

Possible solution

Downgrade the version of chart.js to 3.5.1. It entirely solves the problem

Context

No response

chart.js version

v3.8.0

Browser name and version

No response

Link to your project

No response

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions