Skip to content

Commit

Permalink
fix (logo/no label text/label color specified) case
Browse files Browse the repository at this point in the history 
issue #4926
  • Loading branch information
@chris48s
chris48s committed Apr 19, 2020
1 parent 9fe3753 commit 4999e55
Show file tree
Hide file tree
Showing 3 changed files with 94 additions and 13 deletions.
28 changes: 24 additions & 4 deletions __snapshots__/make-badge.spec.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

14 changes: 10 additions & 4 deletions badge-maker/lib/badge-renderers.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -161,7 +161,7 @@ class Badge {
logoWidth,
logoPadding,
color = '#4c1',
labelColor = '#555',
labelColor,
}) {
const horizPadding = 5
const { hasLogo, totalLogoWidth, renderedLogo } = renderLogo({
Expand All @@ -171,7 +171,10 @@ class Badge {
logoWidth,
logoPadding,
})
const hasLabel = label.length
const hasLabel = label.length || labelColor
if (labelColor == null) {
labelColor = '#555'
}

labelColor = hasLabel || hasLogo ? labelColor : color
labelColor = escapeXml(labelColor)
Expand Down Expand Up @@ -520,7 +523,7 @@ function forTheBadge({
logoWidth,
logoPadding,
color = '#4c1',
labelColor = '#555',
labelColor,
minify,
}) {
// For the Badge is styled in all caps. Convert to caps here so widths can
Expand All @@ -530,7 +533,10 @@ function forTheBadge({

let { labelWidth, messageWidth } = computeWidths({ label, message })
const height = 28
const hasLabel = label.length
const hasLabel = label.length || labelColor
if (labelColor == null) {
labelColor = '#555'
}
const horizPadding = 9
const { hasLogo, totalLogoWidth, renderedLogo } = renderLogo({
logo,
Expand Down
65 changes: 60 additions & 5 deletions badge-maker/lib/make-badge.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -165,12 +165,23 @@ describe('The badge generator', function() {
format: 'svg',
template: 'flat',
color: '#b3e',
labelColor: '#0f0',
})
)
})

it('should match snapshots: message only, with logo', function() {
snapshot(
makeBadge({
text: ['', 'grown'],
format: 'svg',
template: 'flat',
color: '#b3e',
logo: 'data:image/svg+xml;base64,PHN2ZyB4bWxu',
})
)
})

it('should match snapshots: message only, with logo and labelColor', function() {
snapshot(
makeBadge({
text: ['', 'grown'],
Expand Down Expand Up @@ -230,12 +241,23 @@ describe('The badge generator', function() {
format: 'svg',
template: 'flat-square',
color: '#b3e',
labelColor: '#0f0',
})
)
})

it('should match snapshots: message only, with logo', function() {
snapshot(
makeBadge({
text: ['', 'grown'],
format: 'svg',
template: 'flat-square',
color: '#b3e',
logo: 'data:image/svg+xml;base64,PHN2ZyB4bWxu',
})
)
})

it('should match snapshots: message only, with logo and labelColor', function() {
snapshot(
makeBadge({
text: ['', 'grown'],
Expand Down Expand Up @@ -295,12 +317,23 @@ describe('The badge generator', function() {
format: 'svg',
template: 'plastic',
color: '#b3e',
labelColor: '#0f0',
})
)
})

it('should match snapshots: message only, with logo', function() {
snapshot(
makeBadge({
text: ['', 'grown'],
format: 'svg',
template: 'plastic',
color: '#b3e',
logo: 'data:image/svg+xml;base64,PHN2ZyB4bWxu',
})
)
})

it('should match snapshots: message only, with logo and labelColor', function() {
snapshot(
makeBadge({
text: ['', 'grown'],
Expand Down Expand Up @@ -383,12 +416,23 @@ describe('The badge generator', function() {
format: 'svg',
template: 'for-the-badge',
color: '#b3e',
labelColor: '#0f0',
})
)
})

it('should match snapshots: message only, with logo', function() {
snapshot(
makeBadge({
text: ['', 'grown'],
format: 'svg',
template: 'for-the-badge',
color: '#b3e',
logo: 'data:image/svg+xml;base64,PHN2ZyB4bWxu',
})
)
})

it('should match snapshots: message only, with logo and labelColor', function() {
snapshot(
makeBadge({
text: ['', 'grown'],
Expand Down Expand Up @@ -471,12 +515,23 @@ describe('The badge generator', function() {
format: 'svg',
template: 'social',
color: '#b3e',
labelColor: '#0f0',
})
)
})

it('should match snapshots: message only, with logo', function() {
snapshot(
makeBadge({
text: ['', 'grown'],
format: 'svg',
template: 'social',
color: '#b3e',
logo: 'data:image/svg+xml;base64,PHN2ZyB4bWxu',
})
)
})

it('should match snapshots: message only, with logo and labelColor', function() {
snapshot(
makeBadge({
text: ['', 'grown'],
Expand Down

1 comment on commit 4999e55

@paulmelnikow
Copy link
Member

Choose a reason for hiding this comment

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

Could you add this to the dev test page, too?

Please sign in to comment.