Merge pull request #279 from ing-bank/fix/a11yMinus

Fix a11y - use proper minus sign unicode that most SRs understand
This commit is contained in:
Joren Broekema 2019-09-20 01:21:26 -07:00 committed by GitHub
commit 07f04ddd2d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 14 additions and 11 deletions

View file

@ -60,7 +60,7 @@ describe('formatAmount()', () => {
minimumFractionDigits: 2, minimumFractionDigits: 2,
maximumFractionDigits: 2, maximumFractionDigits: 2,
}), }),
).to.equal('-12.35'); ).to.equal('12.35');
}); });
it('formats the right amount of fraction digits for a certain currency', async () => { it('formats the right amount of fraction digits for a certain currency', async () => {

View file

@ -28,7 +28,10 @@ export function formatNumberToParts(number, options) {
const formattedNumber = Intl.NumberFormat(computedLocale, options).format(parsedNumber); const formattedNumber = Intl.NumberFormat(computedLocale, options).format(parsedNumber);
const regexSymbol = /[A-Z.,\s0-9]/; const regexSymbol = /[A-Z.,\s0-9]/;
const regexCode = /[A-Z]/; const regexCode = /[A-Z]/;
// U+002D, Hyphen-Minus, -
const regexMinusSign = /[-]/; const regexMinusSign = /[-]/;
const regexNum = /[0-9]/; const regexNum = /[0-9]/;
const regexSeparator = /[.,]/; const regexSeparator = /[.,]/;
const regexSpace = /[\s]/; const regexSpace = /[\s]/;
@ -38,7 +41,7 @@ export function formatNumberToParts(number, options) {
for (let i = 0; i < formattedNumber.length; i += 1) { for (let i = 0; i < formattedNumber.length; i += 1) {
// detect minusSign // detect minusSign
if (regexMinusSign.test(formattedNumber[i])) { if (regexMinusSign.test(formattedNumber[i])) {
formattedParts.push({ type: 'minusSign', value: formattedNumber[i] }); formattedParts.push({ type: 'minusSign', value: '' /* U+2212, 'Minus-Sign', &minus; */ });
} }
// detect numbers // detect numbers
if (regexNum.test(formattedNumber[i])) { if (regexNum.test(formattedNumber[i])) {

View file

@ -27,32 +27,32 @@ describe('formatNumber', () => {
expect(formatNumber(123456.789, currencySymbol('USD'))).to.equal('$123,456.79'); expect(formatNumber(123456.789, currencySymbol('USD'))).to.equal('$123,456.79');
}); });
it('uses minus (and not dash) to indicate negative numbers ', () => { it('uses minus U+2212 (and not dash) to indicate negative numbers ', () => {
expect(formatNumber(-12, { style: 'decimal', maximumFractionDigits: 0 })).to.equal('-12'); expect(formatNumber(-12, { style: 'decimal', maximumFractionDigits: 0 })).to.equal('12');
}); });
it('rounds (negative) numbers e.g. `roundMode: round`', () => { it('rounds (negative) numbers e.g. `roundMode: round`', () => {
expect(formatNumber(12.4, { roundMode: 'round' })).to.equal('12'); expect(formatNumber(12.4, { roundMode: 'round' })).to.equal('12');
expect(formatNumber(12.6, { roundMode: 'round' })).to.equal('13'); expect(formatNumber(12.6, { roundMode: 'round' })).to.equal('13');
expect(formatNumber(-12.4, { roundMode: 'round' })).to.equal('-12'); expect(formatNumber(-12.4, { roundMode: 'round' })).to.equal('12');
expect(formatNumber(-12.6, { roundMode: 'round' })).to.equal('-13'); expect(formatNumber(-12.6, { roundMode: 'round' })).to.equal('13');
}); });
it("rounds (negative) numbers up when `roundMode: 'ceiling'`", () => { it("rounds (negative) numbers up when `roundMode: 'ceiling'`", () => {
expect(formatNumber(12.4, { roundMode: 'ceiling' })).to.equal('13'); expect(formatNumber(12.4, { roundMode: 'ceiling' })).to.equal('13');
expect(formatNumber(12.6, { roundMode: 'ceiling' })).to.equal('13'); expect(formatNumber(12.6, { roundMode: 'ceiling' })).to.equal('13');
expect(formatNumber(-12.4, { roundMode: 'ceiling' })).to.equal('-12'); expect(formatNumber(-12.4, { roundMode: 'ceiling' })).to.equal('12');
expect(formatNumber(-12.6, { roundMode: 'ceiling' })).to.equal('-12'); expect(formatNumber(-12.6, { roundMode: 'ceiling' })).to.equal('12');
}); });
it('rounds (negative) numbers down when `roundMode: floor`', () => { it('rounds (negative) numbers down when `roundMode: floor`', () => {
expect(formatNumber(12.4, { roundMode: 'floor' })).to.equal('12'); expect(formatNumber(12.4, { roundMode: 'floor' })).to.equal('12');
expect(formatNumber(12.6, { roundMode: 'floor' })).to.equal('12'); expect(formatNumber(12.6, { roundMode: 'floor' })).to.equal('12');
expect(formatNumber(-12.4, { roundMode: 'floor' })).to.equal('-13'); expect(formatNumber(-12.4, { roundMode: 'floor' })).to.equal('13');
expect(formatNumber(-12.6, { roundMode: 'floor' })).to.equal('-13'); expect(formatNumber(-12.6, { roundMode: 'floor' })).to.equal('13');
}); });
it('returns empty string when NaN', () => { it('returns empty string when NaN', () => {

View file

@ -10,7 +10,7 @@ const i = v => ({ type: 'integer', value: v });
const f = v => ({ type: 'fraction', value: v }); const f = v => ({ type: 'fraction', value: v });
const g = v => ({ type: 'group', value: v }); const g = v => ({ type: 'group', value: v });
const l = v => ({ type: 'literal', value: v }); const l = v => ({ type: 'literal', value: v });
const m = { type: 'minusSign', value: '-' }; const m = { type: 'minusSign', value: '' };
const stringifyParts = parts => parts.map(part => part.value).join(''); const stringifyParts = parts => parts.map(part => part.value).join('');