How to hide canvas content from parent rounded corners in any webkit for Mac?

Question

I have a parent div with rounded corners that contains a canvas:

Answer 1

I found an asfwer for Safari. Add webkit mask with single pixel png to the parent and the clipping of overflowing parts will render fine.

-webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);

JsFiddle sample