Detect conflicting multi-rule classes (#498)

master
Brad Cornes 2022-02-25 13:20:02 +00:00 committed by GitHub
parent 627d463f8f
commit 4be5d9d082
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 25 additions and 29 deletions

View File

@ -25,42 +25,40 @@ export async function getCssConflictDiagnostics(
classNames.forEach((className, index) => { classNames.forEach((className, index) => {
if (state.jit) { if (state.jit) {
let { rules } = jit.generateRules(state, [className.className]) let { rules } = jit.generateRules(state, [className.className])
if (rules.length !== 1) { if (rules.length === 0) {
return return
} }
let rule = rules[0]
let context: string[] let info: Array<{ context: string[]; properties: string[] }> = rules.map((rule) => {
let properties = [] let properties: string[] = []
rule.walkDecls(({ prop }) => { rule.walkDecls(({ prop }) => {
properties.push(prop) properties.push(prop)
})
let context = jit.getRuleContext(state, rule, className.className)
return { context, properties }
}) })
let otherClassNames = classNames.filter((_className, i) => i !== index) let otherClassNames = classNames.filter((_className, i) => i !== index)
let conflictingClassNames = otherClassNames.filter((otherClassName) => { let conflictingClassNames = otherClassNames.filter((otherClassName) => {
let { rules } = jit.generateRules(state, [otherClassName.className]) let { rules: otherRules } = jit.generateRules(state, [otherClassName.className])
if (rules.length !== 1) { if (otherRules.length !== rules.length) {
return false return false
} }
let otherRule = rules[0] for (let i = 0; i < otherRules.length; i++) {
let rule = otherRules[i]
let otherProperties = [] let properties: string[] = []
otherRule.walkDecls(({ prop }) => { rule.walkDecls(({ prop }) => {
otherProperties.push(prop) properties.push(prop)
}) })
if (!equal(info[i].properties, properties)) {
if (!equal(properties, otherProperties)) { return false
return false }
} let context = jit.getRuleContext(state, rule, otherClassName.className)
if (!equal(info[i].context, context)) {
if (!context) { return false
context = jit.getRuleContext(state, rule, className.className) }
}
let otherContext = jit.getRuleContext(state, otherRule, otherClassName.className)
if (!equal(context, otherContext)) {
return false
} }
return true return true
@ -77,9 +75,7 @@ export async function getCssConflictDiagnostics(
severity === 'error' severity === 'error'
? 1 /* DiagnosticSeverity.Error */ ? 1 /* DiagnosticSeverity.Error */
: 2 /* DiagnosticSeverity.Warning */, : 2 /* DiagnosticSeverity.Warning */,
message: `'${className.className}' applies the same CSS ${ message: `'${className.className}' applies the same CSS properties as ${joinWithAnd(
properties.length === 1 ? 'property' : 'properties'
} as ${joinWithAnd(
conflictingClassNames.map( conflictingClassNames.map(
(conflictingClassName) => `'${conflictingClassName.className}'` (conflictingClassName) => `'${conflictingClassName.className}'`
) )