diff --git a/core/base-service/coalesce-badge.js b/core/base-service/coalesce-badge.js
index 6a809cf785aeadc707feb88a2c8b884e00ce739b..30819fb81485f51ebc3912bafb26b2b8d09d210f 100644
--- a/core/base-service/coalesce-badge.js
+++ b/core/base-service/coalesce-badge.js
@@ -41,19 +41,36 @@ module.exports = function coalesceBadge(
defaultBadgeData,
{ category, _cacheLength: defaultCacheSeconds } = {}
) {
+ // The "overrideX" naming is based on services that provide badge
+ // parameters themselves, which can be overridden by a query string
+ // parameter. (For a couple services, the dynamic badge and the
+ // query-string-based static badge, the service never sets a value
+ // so the query string overrides are the _only_ way to configure
+ // these badge parameters.
const {
style: overrideStyle,
label: overrideLabel,
logoColor: overrideLogoColor,
link: overrideLink,
+ colorB: legacyOverrideColor,
+ colorA: legacyOverrideLabelColor,
} = overrides
- // Scoutcamp converts numeric query params to numbers. Convert them back.
let {
- colorB: overrideColor,
- colorA: overrideLabelColor,
logoWidth: overrideLogoWidth,
logoPosition: overrideLogoPosition,
+ color: overrideColor,
+ labelColor: overrideLabelColor,
} = overrides
+
+ // Only use the legacy properties of the new ones are not provided
+ if (typeof overrideColor === 'undefined') {
+ overrideColor = legacyOverrideColor
+ }
+ if (typeof overrideLabelColor === 'undefined') {
+ overrideLabelColor = legacyOverrideLabelColor
+ }
+
+ // Scoutcamp converts numeric query params to numbers. Convert them back.
if (typeof overrideColor === 'number') {
overrideColor = `${overrideColor}`
}
diff --git a/core/base-service/coalesce-badge.spec.js b/core/base-service/coalesce-badge.spec.js
index 90416ee9731cda0ddd3a7861d68bd6e80391a980..e543a5599d3a4e549d1e188842a19f55519417a0 100644
--- a/core/base-service/coalesce-badge.spec.js
+++ b/core/base-service/coalesce-badge.spec.js
@@ -58,15 +58,27 @@ describe('coalesceBadge', function() {
it('overrides the color', function() {
expect(
- coalesceBadge({ colorB: '10ADED' }, { color: 'red' }, {}).color
+ coalesceBadge({ color: '10ADED' }, { color: 'red' }, {}).color
).to.equal('10ADED')
+ // also expected for legacy name
+ expect(
+ coalesceBadge({ colorB: 'B0ADED' }, { color: 'red' }, {}).color
+ ).to.equal('B0ADED')
})
context('In case of an error', function() {
it('does not override the color', function() {
expect(
coalesceBadge(
- { colorB: '10ADED' },
+ { color: '10ADED' },
+ { isError: true, color: 'lightgray' },
+ {}
+ ).color
+ ).to.equal('lightgray')
+ // also expected for legacy name
+ expect(
+ coalesceBadge(
+ { colorB: 'B0ADED' },
{ isError: true, color: 'lightgray' },
{}
).color
@@ -92,11 +104,25 @@ describe('coalesceBadge', function() {
it('overrides the label color', function() {
expect(
- coalesceBadge({ colorA: '42f483' }, { color: 'green' }, {}).labelColor
+ coalesceBadge({ labelColor: '42f483' }, { color: 'green' }, {})
+ .labelColor
).to.equal('42f483')
+ // also expected for legacy name
+ expect(
+ coalesceBadge({ colorA: 'B2f483' }, { color: 'green' }, {}).labelColor
+ ).to.equal('B2f483')
})
it('converts a query-string numeric color to a string', function() {
+ expect(
+ coalesceBadge(
+ // Scoutcamp converts numeric query params to numbers.
+ { color: 123 },
+ { color: 'green' },
+ {}
+ ).color
+ ).to.equal('123')
+ // also expected for legacy name
expect(
coalesceBadge(
// Scoutcamp converts numeric query params to numbers.
diff --git a/core/base-service/legacy-request-handler.js b/core/base-service/legacy-request-handler.js
index 9795d77d542a58e0a3d8b5d86c1981d6e8885e91..f5e0903857c713e67f056a39b5d7a4a5e75b2197 100644
--- a/core/base-service/legacy-request-handler.js
+++ b/core/base-service/legacy-request-handler.js
@@ -52,6 +52,8 @@ const globalQueryParams = new Set([
'link',
'colorA',
'colorB',
+ 'color',
+ 'labelColor',
])
function flattenQueryParams(queryParams) {
diff --git a/core/base-service/legacy-request-handler.spec.js b/core/base-service/legacy-request-handler.spec.js
index f501a9eed5f9abbd6c3fc97c9d50199af2b7ece7..b1dbc5519515d650b634c5c793c25d34bc6ba0d4 100644
--- a/core/base-service/legacy-request-handler.spec.js
+++ b/core/base-service/legacy-request-handler.spec.js
@@ -297,17 +297,17 @@ describe('The request handler', function() {
beforeEach(function() {
register({ cacheHeaderConfig: standardCacheHeaders })
})
- const expectedCacheKey = '/testing/123.json?colorB=123&label=foo'
+ const expectedCacheKey = '/testing/123.json?color=123&label=foo'
it('should match expected and use canonical order - 1', async function() {
const res = await fetch(
- `${baseUrl}/testing/123.json?colorB=123&label=foo`
+ `${baseUrl}/testing/123.json?color=123&label=foo`
)
expect(res.ok).to.be.true
expect(_requestCache.cache).to.have.keys(expectedCacheKey)
})
it('should match expected and use canonical order - 2', async function() {
const res = await fetch(
- `${baseUrl}/testing/123.json?label=foo&colorB=123`
+ `${baseUrl}/testing/123.json?label=foo&color=123`
)
expect(res.ok).to.be.true
expect(_requestCache.cache).to.have.keys(expectedCacheKey)
diff --git a/frontend/components/customizer/query-string-builder.js b/frontend/components/customizer/query-string-builder.js
index e1aee38ecb90c4d19a6842c17c6bf235ae3a5338..9297c1193fb29d09445429c75b2a7c44b8bc7ebd 100644
--- a/frontend/components/customizer/query-string-builder.js
+++ b/frontend/components/customizer/query-string-builder.js
@@ -26,7 +26,7 @@ const QueryParamCaption = styled(BuilderCaption)`
const supportedBadgeOptions = [
{ name: 'style', shieldsDefaultValue: 'flat' },
{ name: 'label', label: 'override label' },
- { name: 'colorB', label: 'override color' },
+ { name: 'color', label: 'override color' },
{ name: 'logo', label: 'named logo' },
{ name: 'logoColor', label: 'override logo color' },
]
diff --git a/frontend/components/usage.js b/frontend/components/usage.js
index 7a88c2fef0f23bb1dadab267c1370fa21a2b3f46..dfb50954422b4fa72ad3a8f08ecf587b7b752bb9 100644
--- a/frontend/components/usage.js
+++ b/frontend/components/usage.js
@@ -243,7 +243,7 @@ export default class Usage extends React.PureComponent {
>
$.DATA.SUBDATA
</a>
- >&colorB=<COLOR>&prefix=<PREFIX>&suffix=<SUFFIX>
+ >&color=<COLOR>&prefix=<PREFIX>&suffix=<SUFFIX>
</StyledCode>
</p>
<p>
@@ -257,7 +257,7 @@ export default class Usage extends React.PureComponent {
>
//data/subdata
</a>
- >&colorB=<COLOR>&prefix=<PREFIX>&suffix=<SUFFIX>
+ >&color=<COLOR>&prefix=<PREFIX>&suffix=<SUFFIX>
</StyledCode>
</p>
<p>
@@ -271,7 +271,7 @@ export default class Usage extends React.PureComponent {
>
$.DATA.SUBDATA
</a>
- >&colorB=<COLOR>&prefix=<PREFIX>&suffix=<SUFFIX>
+ >&color=<COLOR>&prefix=<PREFIX>&suffix=<SUFFIX>
</StyledCode>
</p>
@@ -352,22 +352,24 @@ export default class Usage extends React.PureComponent {
}
/>
<QueryParam
- key="colorA"
- snippet="?colorA=abcdef"
+ key="labelColor"
+ snippet="?labelColor=abcdef"
documentation={
<span>
Set background of the left part (hex, rgb, rgba, hsl, hsla and
- css named colors supported)
+ css named colors supported). The legacy name "colorA" is also
+ supported.
</span>
}
/>
<QueryParam
- key="colorB"
- snippet="?colorB=fedcba"
+ key="color"
+ snippet="?color=fedcba"
documentation={
<span>
Set background of the right part (hex, rgb, rgba, hsl, hsla
- and css named colors supported)
+ and css named colors supported). The legacy name "colorB" is
+ also supported.
</span>
}
/>
diff --git a/frontend/lib/badge-url.js b/frontend/lib/badge-url.js
index d6f5c6c5adc19419ab3e9a74f573c69e7ba01532..5ff3aca4c72724823e28806d551eaf2c87e89974 100644
--- a/frontend/lib/badge-url.js
+++ b/frontend/lib/badge-url.js
@@ -38,7 +38,7 @@ export function dynamicBadgeUrl(
})
if (color) {
- queryParams.colorB = color
+ queryParams.color = color
}
if (prefix) {
queryParams.prefix = prefix
diff --git a/frontend/lib/badge-url.spec.js b/frontend/lib/badge-url.spec.js
index 2265a80e06ffdda21f25dd70c4efa3e4013b83e8..4817e4cb133c00516bb528b6b613759ceec679b1 100644
--- a/frontend/lib/badge-url.spec.js
+++ b/frontend/lib/badge-url.spec.js
@@ -58,7 +58,7 @@ describe('Badge URL functions', function() {
'?label=foo',
`&url=${encodeURIComponent(dataUrl)}`,
`&query=${encodeURIComponent(query)}`,
- '&colorB=blue',
+ '&color=blue',
`&suffix=${encodeURIComponent(suffix)}`,
'&style=plastic',
].join('')
diff --git a/frontend/pages/endpoint.js b/frontend/pages/endpoint.js
index 2ed6e34a6eb7778f0bd4c4b696b46075c2c143bf..71cc07282d5de84d16783e297a5ee52ccea6cb3d 100644
--- a/frontend/pages/endpoint.js
+++ b/frontend/pages/endpoint.js
@@ -173,11 +173,12 @@ const EndpointPage = () => (
<dd>
Default: <code>lightgrey</code>. The right color. Supports the eight
named colors above, as well as hex, rgb, rgba, hsl, hsla and css named
- colors.
+ colors. This can be overridden by the query string.
</dd>
<dt>labelColor</dt>
<dd>
- Default: <code>grey</code>. The left color.
+ Default: <code>grey</code>. The left color. This can be overridden by
+ the query string.
</dd>
<dt>isError</dt>
<dd>
diff --git a/services/endpoint/endpoint.tester.js b/services/endpoint/endpoint.tester.js
index 2d8fd9a4c260ec9bd30b9f7e37ccd34870e68314..371969bc136e4d60cc5266948ac5667ba02ba7fc 100644
--- a/services/endpoint/endpoint.tester.js
+++ b/services/endpoint/endpoint.tester.js
@@ -170,6 +170,20 @@ t.create('Invalid schema (mocked)')
})
t.create('User color overrides success color')
+ .get('.json?url=https://example.com/badge&color=101010&style=_shields_test')
+ .intercept(nock =>
+ nock('https://example.com/')
+ .get('/badge')
+ .reply(200, {
+ schemaVersion: 1,
+ label: '',
+ message: 'yo',
+ color: 'blue',
+ })
+ )
+ .expectJSON({ name: '', value: 'yo', color: '#101010' })
+
+t.create('User legacy color overrides success color')
.get('.json?url=https://example.com/badge&colorB=101010&style=_shields_test')
.intercept(nock =>
nock('https://example.com/')
@@ -184,6 +198,21 @@ t.create('User color overrides success color')
.expectJSON({ name: '', value: 'yo', color: '#101010' })
t.create('User color does not override error color')
+ .get('.json?url=https://example.com/badge&color=101010&style=_shields_test')
+ .intercept(nock =>
+ nock('https://example.com/')
+ .get('/badge')
+ .reply(200, {
+ schemaVersion: 1,
+ isError: true,
+ label: 'something is',
+ message: 'not right',
+ color: 'red',
+ })
+ )
+ .expectJSON({ name: 'something is', value: 'not right', color: 'red' })
+
+t.create('User legacy color does not override error color')
.get('.json?url=https://example.com/badge&colorB=101010&style=_shields_test')
.intercept(nock =>
nock('https://example.com/')