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.

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

Fix aspect ratio and add responsive unit tests #3356

Merged
merged 4 commits into from Sep 24, 2016

Conversation

simonbrunel
Copy link
Member

Should have been only unit tests but then I realized that aspect ratio for none responsive chart was totally broken. So I decided to clean up the whole canvas initialization process and I hope to not have broken too many things :)

This PR includes:

  • correctly handles aspect ratio on chart creation (see unit tests for the many cases)
  • properly restore initial canvas render size and overridden style on destroy
  • fix default aspectRatio for radar chart and associated samples
  • move most of the canvas initialization in the core.controller.js
  • new test/core.controller.tests.js currently testing AR and responsiveness (see screenshot below)
  • new command switch to run specific tests (gulp unittest --inputs=test/core.controller.tests.js)

More details in commit messages

image

Add the --inputs command switch to the unittest and unittestWatch tasks, to be able to run unit tests from the specified files only (e.g. gulp unittest --inputs=test/core.element.tests.js;test/core.helpers.tests.js).
When responsive is false and no canvas height explicitly set, the aspectRatio option wasn't applied because of the canvas default height. Prevent the retinaScale method to change the canvas display size since this method is called for none responsive charts, but instead make the resize() responsible of these changes. Also, as discussed some time ago, moved most of the core.js logic into core.controller.js. Clean up the destroy process and make sure that initial canvas values are properly saved and restored.
Now that the aspect ratio is correctly handled, fix samples for charts with aspect ratio of 1 which was vertically too large. Also fix the default aspect ratio for radar charts which wasn't applied when creating a chart directly using new Chart(ctx, { type: 'radar' }).
@simonbrunel simonbrunel force-pushed the aspect-ratio branch 4 times, most recently from 4728bd5 to 5c8d98b Compare September 23, 2016 21:59
@simonbrunel
Copy link
Member Author

Finally stabilized unit tests (was actually failing because of #3152) ... so ready for @chartjs/maintainers review :)

@simonbrunel simonbrunel added this to the Version 2.4 milestone Sep 23, 2016
@tannerlinsley
Copy link
Contributor

Looks good to me
On Fri, Sep 23, 2016 at 4:18 PM Simon Brunel notifications@github.com
wrote:

Finally stabilized unit tests (was actually failing because of #3152
#3152) ... so ready for
@chartjs/maintainers https://github.com/orgs/chartjs/teams/maintainers
review :)


You are receiving this because you are on a team that was mentioned.
Reply to this email directly, view it on GitHub
#3356 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AFUmCeuzzxhFZ3YBirQj1ZQBFXE_7t45ks5qtFAjgaJpZM4KFJop
.

Copy link
Member

@etimberg etimberg left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good

var renderWidth = canvas.getAttribute('width');

// Chart.js modifies some canvas values that we want to restore on destroy
canvas._chartjs = {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I like this

@etimberg etimberg merged commit ba13387 into chartjs:master Sep 24, 2016
@simonbrunel simonbrunel deleted the aspect-ratio branch September 24, 2016 19:45
exwm pushed a commit to exwm/Chart.js that referenced this pull request Apr 30, 2021
Fix aspect ratio and add responsive unit tests
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants