mirror of https://github.com/vuejs/core.git
fix(ssr): remove css number value check (#6636)
Previously this prevented custom properties and vendor-prefixed properties to be rendered correctly. fix #6625
This commit is contained in:
parent
04553786e4
commit
79e7c1ee43
|
@ -154,10 +154,12 @@ describe('ssr: renderStyle', () => {
|
|||
expect(
|
||||
ssrRenderAttrs({
|
||||
style: {
|
||||
color: 'red'
|
||||
color: 'red',
|
||||
'--a': 2,
|
||||
'-webkit-line-clamp': 1
|
||||
}
|
||||
})
|
||||
).toBe(` style="color:red;"`)
|
||||
).toBe(` style="color:red;--a:2;-webkit-line-clamp:1;"`)
|
||||
})
|
||||
|
||||
test('standalone', () => {
|
||||
|
@ -178,7 +180,7 @@ describe('ssr: renderStyle', () => {
|
|||
test('number handling', () => {
|
||||
expect(
|
||||
ssrRenderStyle({
|
||||
fontSize: 15, // should be ignored since font-size requires unit
|
||||
fontSize: null, // invalid value should be ignored
|
||||
opacity: 0.5
|
||||
})
|
||||
).toBe(`opacity:0.5;`)
|
||||
|
|
|
@ -53,21 +53,6 @@ export const propsToAttrMap: Record<string, string | undefined> = {
|
|||
httpEquiv: 'http-equiv'
|
||||
}
|
||||
|
||||
/**
|
||||
* CSS properties that accept plain numbers
|
||||
*/
|
||||
export const isNoUnitNumericStyleProp = /*#__PURE__*/ makeMap(
|
||||
`animation-iteration-count,border-image-outset,border-image-slice,` +
|
||||
`border-image-width,box-flex,box-flex-group,box-ordinal-group,column-count,` +
|
||||
`columns,flex,flex-grow,flex-positive,flex-shrink,flex-negative,flex-order,` +
|
||||
`grid-row,grid-row-end,grid-row-span,grid-row-start,grid-column,` +
|
||||
`grid-column-end,grid-column-span,grid-column-start,font-weight,line-clamp,` +
|
||||
`line-height,opacity,order,orphans,tab-size,widows,z-index,zoom,` +
|
||||
// SVG
|
||||
`fill-opacity,flood-opacity,stop-opacity,stroke-dasharray,stroke-dashoffset,` +
|
||||
`stroke-miterlimit,stroke-opacity,stroke-width`
|
||||
)
|
||||
|
||||
/**
|
||||
* Known attributes, this is used for stringification of runtime static nodes
|
||||
* so that we don't stringify bindings that cannot be set from HTML.
|
||||
|
|
|
@ -1,5 +1,4 @@
|
|||
import { isArray, isString, isObject, hyphenate } from './'
|
||||
import { isNoUnitNumericStyleProp } from './domAttrConfig'
|
||||
|
||||
export type NormalizedStyle = Record<string, string | number>
|
||||
|
||||
|
@ -51,10 +50,7 @@ export function stringifyStyle(
|
|||
for (const key in styles) {
|
||||
const value = styles[key]
|
||||
const normalizedKey = key.startsWith(`--`) ? key : hyphenate(key)
|
||||
if (
|
||||
isString(value) ||
|
||||
(typeof value === 'number' && isNoUnitNumericStyleProp(normalizedKey))
|
||||
) {
|
||||
if (isString(value) || typeof value === 'number') {
|
||||
// only render valid values
|
||||
ret += `${normalizedKey}:${value};`
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue