D3 Projects - Failing Test


I’m currently working on the D3 projects and I can’t get the tests to pass. In both the projects, the tooltip test fails even though I have tooltips with the right id. What am I doing wrong?

Here are the links to the two projects:
Bar Chart: https://pzqvo.csb.app/
Scatter Plot: https://ekthw.csb.app/

Thank you!

I can’t see the tooltips in either project. When you hover a bar or a point on the scatterplot you’re meant to see a tooltip popup displaying the values for that data point like on the example project: https://codepen.io/freeCodeCamp/full/GrZVaM .

Other than that these projects look really nice.

I used the built-in tooltip (“title”) that shows up when you hover over the bar for a second. I’ll try using a custom div. Thanks!

The problem with title is that you’re appending it to each and every rect element, so in the end you have a lot of elements with id “tooltip”.

Thanks! You are right. I realized that when I inspected the page. I changed it so that there is only one #tooltip and the information is updated in that one. This way, the tooltips pass the test. Currently, it fails only one test; trying to figure out why it says the x-values do not correspond correctly: https://pzqvo.csb.app/

Edit: Found the issue. I had to make the xScale as scaleTime and not scaleLinear.