MCPcopy
hub / github.com/vuejs/core / propHasMismatch

Function propHasMismatch

packages/runtime-core/src/hydration.ts:804–904  ·  view source on GitHub ↗

* Dev only

(
  el: Element & { $cls?: string },
  key: string,
  clientValue: any,
  vnode: VNode,
  instance: ComponentInternalInstance | null,
)

Source from the content-addressed store, hash-verified

802 * Dev only
803 */
804function propHasMismatch(
805 el: Element & { $cls?: string },
806 key: string,
807 clientValue: any,
808 vnode: VNode,
809 instance: ComponentInternalInstance | null,
810): boolean {
811 let mismatchType: MismatchTypes | undefined
812 let mismatchKey: string | undefined
813 let actual: string | boolean | null | undefined
814 let expected: string | boolean | null | undefined
815 if (key === 'class') {
816 // classes might be in different order, but that doesn't affect cascade
817 // so we just need to check if the class lists contain the same classes.
818 if (el.$cls) {
819 actual = el.$cls
820 delete el.$cls
821 } else {
822 actual = el.getAttribute('class')
823 }
824 expected = normalizeClass(clientValue)
825 if (!isSetEqual(toClassSet(actual || ''), toClassSet(expected))) {
826 mismatchType = MismatchTypes.CLASS
827 mismatchKey = `class`
828 }
829 } else if (key === 'style') {
830 // style might be in different order, but that doesn't affect cascade
831 actual = el.getAttribute('style') || ''
832 expected = isString(clientValue)
833 ? clientValue
834 : stringifyStyle(normalizeStyle(clientValue))
835 const actualMap = toStyleMap(actual)
836 const expectedMap = toStyleMap(expected)
837 // If `v-show=false`, `display: 'none'` should be added to expected
838 if (vnode.dirs) {
839 for (const { dir, value } of vnode.dirs) {
840 // @ts-expect-error only vShow has this internal name
841 if (dir.name === 'show' && !value) {
842 expectedMap.set('display', 'none')
843 }
844 }
845 }
846
847 if (instance) {
848 resolveCssVars(instance, vnode, expectedMap)
849 }
850
851 if (!isMapEqual(actualMap, expectedMap)) {
852 mismatchType = MismatchTypes.STYLE
853 mismatchKey = 'style'
854 }
855 } else if (
856 (el instanceof SVGElement && isKnownSvgAttr(key)) ||
857 (el instanceof HTMLElement && (isBooleanAttr(key) || isKnownHtmlAttr(key)))
858 ) {
859 if (isBooleanAttr(key)) {
860 actual = el.hasAttribute(key)
861 expected = includeBooleanAttr(clientValue)

Callers 1

hydrateElementFunction · 0.85

Calls 15

normalizeClassFunction · 0.90
isStringFunction · 0.90
stringifyStyleFunction · 0.90
normalizeStyleFunction · 0.90
includeBooleanAttrFunction · 0.90
isRenderableAttrValueFunction · 0.90
warnFunction · 0.90
isSetEqualFunction · 0.85
toClassSetFunction · 0.85
toStyleMapFunction · 0.85
resolveCssVarsFunction · 0.85
isMapEqualFunction · 0.85

Tested by

no test coverage detected