Align font options with CSS (#8066)

* Align font options with CSS

* Review comments
This commit is contained in:
Jukka Kurkela 2020-11-19 20:59:24 +02:00 committed by GitHub
parent f96fa2b96d
commit ddc72fcfbb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
23 changed files with 112 additions and 123 deletions

View File

@ -7,4 +7,6 @@
| `font` | `Font` | Yes | `defaults.font` | See [Fonts](../general/fonts.md)
| `major` | `object` | | `{}` | [Major ticks configuration](./styling.mdx#major-tick-configuration).
| `padding` | `number` | | `0` | Sets the offset of the tick labels from the axis
| `textStrokeColor` | `string` | `` | The color of the stroke around the text.
| `textStrokeWidth` | `number` | `0` | Stroke width around the text.
| `z` | `number` | | `0` | z-index of tick layer. Useful when ticks are drawn on chart area. Values <= 0 are drawn under datasets, > 0 on top.

View File

@ -7,7 +7,7 @@ There are special global settings that can change all of the fonts on the chart.
For example, in this chart the text will all be red except for the labels in the legend.
```javascript
Chart.defaults.font.color = 'red';
Chart.defaults.font.size = 16;
let chart = new Chart(ctx, {
type: 'line',
data: data,
@ -16,7 +16,7 @@ let chart = new Chart(ctx, {
labels: {
// This more specific font property overrides the global property
font: {
color: 'black'
size: 14
}
}
}
@ -26,14 +26,11 @@ let chart = new Chart(ctx, {
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------
| `color` | `Color` | `'#666'` | Default font color for all text.
| `family` | `string` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Default font family for all text, follows CSS font-family options.
| `size` | `number` | `12` | Default font size (in px) for text. Does not apply to radialLinear scale point labels.
| `style` | `string` | `'normal'` | Default font style. Does not apply to tooltip title or footer. Does not apply to chart title. Follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit).
| `weight` | `string` | `undefined` | Default font weight (boldness). (see [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight)).
| `lineHeight` | <code>number&#124;string</code> | `1.2` | Height of an individual line of text (see [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height)).
| `lineWidth` | `number` | `0` | Stroke width around the text. Currently only supported by [ticks](../axes/styling#tick-configuration).
| `strokeStyle` | `string` | `` | The color of the stroke around the text. Currently only supported by [ticks](../axes/styling#tick-configuration).
## Missing Fonts

View File

@ -101,8 +101,8 @@ A number of changes were made to the configuration options passed to the `Chart`
* `global` namespace was removed from `defaults`. So `Chart.defaults.global` is now `Chart.defaults`
* Dataset controller defaults were relocate to `controllers`. For example `Chart.defaults.line` is now `Chart.defaults.controllers.line`
* `default` prefix was removed from defaults. For example `Chart.defaults.global.defaultColor` is now `Chart.defaults.color`
* `defaultColor` was renamed to `color`
* `defaultFontColor` was renamed to `font.color`
* `defaultColor` was split to `color`, `borderColor` and `backgroundColor`
* `defaultFontColor` was renamed to `color`
* `defaultFontFamily` was renamed to `font.family`
* `defaultFontSize` was renamed to `font.size`
* `defaultFontStyle` was renamed to `font.style`
@ -169,11 +169,11 @@ options: {
major: {
enabled: true
},
color: (context) => context.tick && context.tick.major && '#FF0000',
font: function(context) {
if (context.tick && context.tick.major) {
return {
style: 'bold',
color: '#FF0000'
style: 'bold'
};
}
}

View File

@ -23,7 +23,10 @@ function getScope(node, key) {
*/
export class Defaults {
constructor() {
this.color = 'rgba(0,0,0,0.1)';
this.backgroundColor = 'rgba(0,0,0,0.1)';
this.borderColor = 'rgba(0,0,0,0.1)';
this.color = '#666';
this.controllers = {};
this.elements = {};
this.events = [
'mousemove',
@ -33,31 +36,27 @@ export class Defaults {
'touchmove'
];
this.font = {
color: '#666',
family: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
size: 12,
style: 'normal',
lineHeight: 1.2,
weight: null,
lineWidth: 0,
strokeStyle: undefined
weight: null
};
this.hover = {
onHover: null
};
this.interaction = {
mode: 'nearest',
intersect: true
};
this.hover = {
onHover: null
};
this.maintainAspectRatio = true;
this.onHover = null;
this.onClick = null;
this.responsive = true;
this.showLine = true;
this.plugins = {};
this.responsive = true;
this.scale = undefined;
this.scales = {};
this.controllers = {};
this.showLine = true;
}
/**

View File

@ -29,7 +29,6 @@ defaults.set('scale', {
// grid line settings
gridLines: {
display: true,
color: 'rgba(0,0,0,0.1)',
lineWidth: 1,
drawBorder: true,
drawOnChartArea: true,
@ -76,6 +75,10 @@ defaults.set('scale', {
}
});
defaults.route('scale.ticks', 'color', '', 'color');
defaults.route('scale.gridLines', 'color', '', 'borderColor');
defaults.route('scale.scaleLabel', 'color', '', 'color');
/**
* Returns a new array containing numItems from arr
* @param {any[]} arr
@ -1402,6 +1405,7 @@ export default class Scale extends Element {
rotation,
label,
font,
color: optionTicks.color,
textOffset,
textAlign,
textBaseline,
@ -1574,20 +1578,20 @@ export default class Scale extends Element {
for (i = 0, ilen = items.length; i < ilen; ++i) {
const item = items[i];
const tickFont = item.font;
const useStroke = tickFont.lineWidth > 0 && tickFont.strokeStyle !== '';
const useStroke = optionTicks.textStrokeWidth > 0 && optionTicks.textStrokeColor !== '';
// Make sure we draw text in the correct color and font
ctx.save();
ctx.translate(item.x, item.y);
ctx.rotate(item.rotation);
ctx.font = tickFont.string;
ctx.fillStyle = tickFont.color;
ctx.fillStyle = item.color;
ctx.textAlign = item.textAlign;
ctx.textBaseline = item.textBaseline;
if (useStroke) {
ctx.strokeStyle = tickFont.strokeStyle;
ctx.lineWidth = tickFont.lineWidth;
ctx.strokeStyle = optionTicks.textStrokeColor;
ctx.lineWidth = optionTicks.textStrokeWidth;
}
const label = item.label;
@ -1678,7 +1682,7 @@ export default class Scale extends Element {
ctx.rotate(rotation);
ctx.textAlign = textAlign;
ctx.textBaseline = 'middle';
ctx.fillStyle = scaleLabelFont.color;
ctx.fillStyle = scaleLabel.color;
ctx.font = scaleLabelFont.string;
ctx.fillText(scaleLabel.labelString, 0, 0);
ctx.restore();

View File

@ -94,10 +94,13 @@ function registerDefaults(item, scope, parentScope) {
function routeDefaults(scope, routes) {
Object.keys(routes).forEach(property => {
const propertyParts = property.split('.');
const sourceName = propertyParts.pop();
const sourceScope = [scope].concat(propertyParts).join('.');
const parts = routes[property].split('.');
const targetName = parts.pop();
const targetScope = parts.join('.');
defaults.route(scope, property, targetScope, targetName);
defaults.route(sourceScope, sourceName, targetScope, targetName);
});
}

View File

@ -221,5 +221,5 @@ ArcElement.defaults = {
* @type {any}
*/
ArcElement.defaultRoutes = {
backgroundColor: 'color'
backgroundColor: 'backgroundColor'
};

View File

@ -263,6 +263,6 @@ BarElement.defaults = {
* @type {any}
*/
BarElement.defaultRoutes = {
backgroundColor: 'color',
borderColor: 'color'
backgroundColor: 'backgroundColor',
borderColor: 'borderColor'
};

View File

@ -390,6 +390,6 @@ LineElement.defaults = {
* @type {any}
*/
LineElement.defaultRoutes = {
backgroundColor: 'color',
borderColor: 'color'
backgroundColor: 'backgroundColor',
borderColor: 'borderColor'
};

View File

@ -84,6 +84,6 @@ PointElement.defaults = {
* @type {any}
*/
PointElement.defaultRoutes = {
backgroundColor: 'color',
borderColor: 'color'
backgroundColor: 'backgroundColor',
borderColor: 'borderColor'
};

View File

@ -125,14 +125,11 @@ export function toFont(options, fallback) {
}
const font = {
color: valueOrDefault(options.color, fallback.color),
family: valueOrDefault(options.family, fallback.family),
lineHeight: toLineHeight(valueOrDefault(options.lineHeight, fallback.lineHeight), size),
lineWidth: valueOrDefault(options.lineWidth, fallback.lineWidth),
size,
style: valueOrDefault(options.style, fallback.style),
weight: valueOrDefault(options.weight, fallback.weight),
strokeStyle: valueOrDefault(options.strokeStyle, fallback.strokeStyle),
string: ''
};

View File

@ -311,7 +311,7 @@ export class Legend extends Element {
const rtlHelper = getRtlAdapter(opts.rtl, me.left, me._minSize.width);
const ctx = me.ctx;
const labelFont = toFont(labelOpts.font, me.chart.options.font);
const fontColor = labelFont.color;
const fontColor = labelOpts.color;
const fontSize = labelFont.size;
let cursor;
@ -542,8 +542,8 @@ export class Legend extends Element {
// Canvas setup
ctx.textAlign = rtlHelper.textAlign(textAlign);
ctx.textBaseline = 'middle';
ctx.strokeStyle = titleFont.color;
ctx.fillStyle = titleFont.color;
ctx.strokeStyle = titleOpts.color;
ctx.fillStyle = titleOpts.color;
ctx.font = titleFont.string;
ctx.fillText(titleOpts.text, x, y);

View File

@ -182,7 +182,7 @@ export class Title extends Element {
ctx.save();
ctx.fillStyle = fontOpts.color;
ctx.fillStyle = opts.color;
ctx.font = fontOpts.string;
ctx.translate(titleX, titleY);
@ -267,5 +267,9 @@ export default {
position: 'top',
text: '',
weight: 2000 // by default greater than legend (1000) to be above
},
defaultRoutes: {
color: 'color'
}
};

View File

@ -653,7 +653,7 @@ export class Tooltip extends Element {
titleFont = options.titleFont;
titleSpacing = options.titleSpacing;
ctx.fillStyle = options.titleFont.color;
ctx.fillStyle = options.titleColor;
ctx.font = titleFont.string;
for (i = 0; i < length; ++i) {
@ -745,7 +745,7 @@ export class Tooltip extends Element {
pt.x = getAlignedX(me, bodyAlignForCalculation);
// Before body lines
ctx.fillStyle = bodyFont.color;
ctx.fillStyle = options.bodyColor;
each(me.beforeBody, fillLineOfText);
xLinePadding = displayColors && bodyAlignForCalculation !== 'right'
@ -803,7 +803,7 @@ export class Tooltip extends Element {
footerFont = options.footerFont;
ctx.fillStyle = options.footerFont.color;
ctx.fillStyle = options.footerColor;
ctx.font = footerFont.string;
for (i = 0; i < length; ++i) {
@ -1098,22 +1098,22 @@ export default {
custom: null,
position: 'average',
backgroundColor: 'rgba(0,0,0,0.8)',
titleColor: '#fff',
titleFont: {
style: 'bold',
color: '#fff',
},
titleSpacing: 2,
titleMarginBottom: 6,
titleAlign: 'left',
bodyColor: '#fff',
bodySpacing: 2,
bodyFont: {
color: '#fff',
},
bodyAlign: 'left',
footerColor: '#fff',
footerSpacing: 2,
footerMarginTop: 6,
footerFont: {
color: '#fff',
style: 'bold',
},
footerAlign: 'left',
@ -1190,7 +1190,7 @@ export default {
};
},
labelTextColor() {
return this.options.bodyFont.color;
return this.options.bodyColor;
},
labelPointStyle(tooltipItem) {
const meta = tooltipItem.chart.getDatasetMeta(tooltipItem.datasetIndex);

View File

@ -183,7 +183,7 @@ function drawPointLabels(scale) {
const context = scale.getContext(i);
const plFont = toFont(resolve([pointLabelOpts.font], context, i), scale.chart.options.font);
ctx.font = plFont.string;
ctx.fillStyle = plFont.color;
ctx.fillStyle = pointLabelOpts.color;
const angle = toDegrees(scale.getIndexAngle(i));
ctx.textAlign = getTextAlignForAngle(angle);
@ -499,7 +499,7 @@ export default class RadialLinearScale extends LinearScaleBase {
);
}
ctx.fillStyle = tickFont.color;
ctx.fillStyle = tickOpts.color;
ctx.fillText(tick.label, 0, -offset);
});
@ -526,7 +526,6 @@ RadialLinearScale.defaults = {
angleLines: {
display: true,
color: 'rgba(0,0,0,0.1)',
lineWidth: 1,
borderDash: [],
borderDashOffset: 0.0
@ -568,3 +567,9 @@ RadialLinearScale.defaults = {
}
}
};
RadialLinearScale.defaultRoutes = {
'angleLines.color': 'borderColor',
'pointLabels.color': 'color',
'ticks.color': 'color'
};

View File

@ -141,8 +141,8 @@ describe('Chart.controllers.bubble', function() {
expect(meta.data[i].x).toBeCloseToPixel(expected.x);
expect(meta.data[i].y).toBeCloseToPixel(expected.y);
expect(meta.data[i].options).toEqual(jasmine.objectContaining({
backgroundColor: Chart.defaults.color,
borderColor: Chart.defaults.color,
backgroundColor: Chart.defaults.backgroundColor,
borderColor: Chart.defaults.borderColor,
borderWidth: 1,
hitRadius: 1,
radius: expected.r

View File

@ -100,9 +100,9 @@ describe('Chart.controllers.radar', function() {
tension: 0.1,
},
point: {
backgroundColor: Chart.defaults.color,
backgroundColor: Chart.defaults.backgroundColor,
borderWidth: 1,
borderColor: Chart.defaults.color,
borderColor: Chart.defaults.borderColor,
hitRadius: 1,
hoverRadius: 4,
hoverBorderWidth: 1,
@ -139,9 +139,9 @@ describe('Chart.controllers.radar', function() {
expect(meta.data[i].x).toBeCloseToPixel(expected.x);
expect(meta.data[i].y).toBeCloseToPixel(expected.y);
expect(meta.data[i].options).toEqual(jasmine.objectContaining({
backgroundColor: Chart.defaults.color,
backgroundColor: Chart.defaults.backgroundColor,
borderWidth: 1,
borderColor: Chart.defaults.color,
borderColor: Chart.defaults.borderColor,
hitRadius: 1,
radius: 3,
pointStyle: 'circle',
@ -164,9 +164,9 @@ describe('Chart.controllers.radar', function() {
expect(meta.data[i].controlPointNextX).toBeCloseToPixel(expected.cpnx);
expect(meta.data[i].controlPointNextY).toBeCloseToPixel(expected.cpny);
expect(meta.data[i].options).toEqual(jasmine.objectContaining({
backgroundColor: Chart.defaults.color,
backgroundColor: Chart.defaults.backgroundColor,
borderWidth: 1,
borderColor: Chart.defaults.color,
borderColor: Chart.defaults.borderColor,
hitRadius: 1,
radius: 3,
pointStyle: 'circle',

View File

@ -610,8 +610,8 @@ describe('Chart.DatasetController', function() {
it('should resolve data element options to the default color', function() {
var data0 = [0, 1, 2, 3, 4, 5];
var oldColor = Chart.defaults.color;
Chart.defaults.color = 'red';
var oldColor = Chart.defaults.borderColor;
Chart.defaults.borderColor = 'red';
var chart = acquireChart({
type: 'line',
data: {
@ -626,7 +626,7 @@ describe('Chart.DatasetController', function() {
expect(meta.data[0].options.borderColor).toBe('red');
// Reset old shared state
Chart.defaults.color = oldColor;
Chart.defaults.borderColor = oldColor;
});
describe('_resolveOptions', function() {

View File

@ -7,13 +7,9 @@ describe('Core.scale', function() {
it('should provide default scale label options', function() {
expect(Chart.defaults.scale.scaleLabel).toEqual({
// display property
color: Chart.defaults.color,
display: false,
// actual label
labelString: '',
// top/bottom padding
padding: {
top: 4,
bottom: 4

View File

@ -1,4 +1,4 @@
const {toLineHeight, toPadding, toFont, resolve, toTRBLCorners} = Chart.helpers; // from '../../src/helpers/helpers.options';
const {toLineHeight, toPadding, toFont, resolve, toTRBLCorners} = Chart.helpers;
describe('Chart.helpers.options', function() {
describe('toLineHeight', function() {
@ -102,7 +102,6 @@ describe('Chart.helpers.options', function() {
const defaultFont = Object.assign({}, Chart.defaults.font);
Object.assign(Chart.defaults.font, {
color: 'bar',
family: 'foobar',
size: 42,
style: 'xxxyyy',
@ -110,55 +109,44 @@ describe('Chart.helpers.options', function() {
});
expect(toFont({})).toEqual({
color: 'bar',
family: 'foobar',
lineHeight: 63,
size: 42,
string: 'xxxyyy 42px foobar',
style: 'xxxyyy',
weight: null,
lineWidth: 0,
strokeStyle: undefined
weight: null
});
Object.assign(Chart.defaults.font, defaultFont);
});
it ('should return a font with given values', function() {
expect(toFont({
color: 'asd',
family: 'bla',
lineHeight: 8,
size: 21,
style: 'zzz'
})).toEqual({
color: 'asd',
family: 'bla',
lineHeight: 8 * 21,
size: 21,
string: 'zzz 21px bla',
style: 'zzz',
weight: null,
lineWidth: 0,
strokeStyle: undefined
weight: null
});
});
it ('should handle a string font size', function() {
expect(toFont({
color: 'asd',
family: 'bla',
lineHeight: 8,
size: '21',
style: 'zzz'
})).toEqual({
color: 'asd',
family: 'bla',
lineHeight: 8 * 21,
size: 21,
string: 'zzz 21px bla',
style: 'zzz',
weight: null,
lineWidth: 0,
strokeStyle: undefined
weight: null
});
});
it('should return null as a font string if size or family are missing', function() {

View File

@ -6,6 +6,7 @@ describe('Title block tests', function() {
it('Should have the correct default config', function() {
expect(Chart.defaults.plugins.title).toEqual({
align: 'center',
color: Chart.defaults.color,
display: false,
position: 'top',
fullWidth: true,

View File

@ -75,9 +75,9 @@ describe('Plugin.Tooltip', function() {
expect(tooltip.options.yPadding).toEqual(6);
expect(tooltip.xAlign).toEqual('left');
expect(tooltip.yAlign).toEqual('center');
expect(tooltip.options.bodyColor).toEqual('#fff');
expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: defaults.font.style,
size: defaults.font.size,
@ -88,8 +88,8 @@ describe('Plugin.Tooltip', function() {
bodySpacing: 2,
}));
expect(tooltip.options.titleColor).toEqual('#fff');
expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: 'bold',
size: defaults.font.size,
@ -101,8 +101,8 @@ describe('Plugin.Tooltip', function() {
titleMarginBottom: 6,
}));
expect(tooltip.options.footerColor).toEqual('#fff');
expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: 'bold',
size: defaults.font.size,
@ -142,11 +142,11 @@ describe('Plugin.Tooltip', function() {
afterBody: [],
footer: [],
labelColors: [{
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}, {
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}]
}));
@ -241,7 +241,6 @@ describe('Plugin.Tooltip', function() {
expect(tooltip.yAlign).toEqual('center');
expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: defaults.font.style,
size: defaults.font.size,
@ -253,7 +252,6 @@ describe('Plugin.Tooltip', function() {
}));
expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: 'bold',
size: defaults.font.size,
@ -266,7 +264,6 @@ describe('Plugin.Tooltip', function() {
}));
expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: 'bold',
size: defaults.font.size,
@ -301,8 +298,8 @@ describe('Plugin.Tooltip', function() {
expect(tooltip.labelTextColors).toEqual(['#fff']);
expect(tooltip.labelColors).toEqual([{
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}]);
expect(tooltip.x).toBeCloseToPixel(267);
@ -396,7 +393,6 @@ describe('Plugin.Tooltip', function() {
expect(tooltip.yAlign).toEqual('center');
expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: defaults.font.style,
size: defaults.font.size,
@ -408,7 +404,6 @@ describe('Plugin.Tooltip', function() {
}));
expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: 'bold',
size: defaults.font.size,
@ -420,7 +415,6 @@ describe('Plugin.Tooltip', function() {
}));
expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: 'bold',
size: defaults.font.size,
@ -460,11 +454,11 @@ describe('Plugin.Tooltip', function() {
footer: ['beforeFooter', 'footer', 'afterFooter'],
labelTextColors: ['labelTextColor', 'labelTextColor'],
labelColors: [{
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}, {
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}],
labelPointStyles: [{
pointStyle: 'labelPointStyle',
@ -580,11 +574,11 @@ describe('Plugin.Tooltip', function() {
afterBody: [],
footer: [],
labelColors: [{
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}, {
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}]
}));
@ -651,11 +645,11 @@ describe('Plugin.Tooltip', function() {
afterBody: [],
footer: [],
labelColors: [{
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}, {
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}]
}));
@ -723,11 +717,11 @@ describe('Plugin.Tooltip', function() {
afterBody: [],
footer: [],
labelColors: [{
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}, {
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}]
}));
@ -794,8 +788,8 @@ describe('Plugin.Tooltip', function() {
afterBody: [],
footer: [],
labelColors: [{
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}]
}));
@ -1229,7 +1223,6 @@ describe('Plugin.Tooltip', function() {
expect(tooltip.yAlign).toEqual('top');
expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: defaults.font.style,
size: defaults.font.size,
@ -1241,7 +1234,6 @@ describe('Plugin.Tooltip', function() {
}));
expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: 'bold',
size: defaults.font.size,
@ -1254,7 +1246,6 @@ describe('Plugin.Tooltip', function() {
}));
expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
color: '#fff',
family: defaults.font.family,
style: 'bold',
size: defaults.font.size,
@ -1294,11 +1285,11 @@ describe('Plugin.Tooltip', function() {
footer: ['beforeFooter', 'newline', 'footer', 'newline', 'afterFooter', 'newline'],
labelTextColors: ['labelTextColor', 'labelTextColor'],
labelColors: [{
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}, {
borderColor: defaults.color,
backgroundColor: defaults.color
borderColor: defaults.borderColor,
backgroundColor: defaults.backgroundColor
}]
}));

View File

@ -32,6 +32,7 @@ describe('Test the radial linear scale', function() {
},
ticks: {
color: Chart.defaults.color,
showLabelBackdrop: true,
backdropColor: 'rgba(255,255,255,0.75)',
backdropPaddingY: 2,
@ -40,6 +41,7 @@ describe('Test the radial linear scale', function() {
},
pointLabels: {
color: Chart.defaults.color,
display: true,
font: {
size: 10