Browse Source

Minimal support for backgroundSize in CSS API

CSS_BASIC_PROPS
Shagen Ogandzhanian 3 years ago
parent
commit
3c47c234ac
  1. 6
      web/core/src/jsMain/kotlin/androidx/compose/web/css/properties/background.kt
  2. 24
      web/core/src/jsTest/kotlin/css/CSSBackgroundTests.kt

6
web/core/src/jsMain/kotlin/androidx/compose/web/css/properties/background.kt

@ -42,3 +42,9 @@ fun StyleBuilder.backgroundRepeat(value: String) {
property("background-repeat", value) property("background-repeat", value)
} }
// https://developer.mozilla.org/en-US/docs/Web/CSS/background-size
fun StyleBuilder.backgroundSize(value: String) {
property("background-size", value)
}

24
web/core/src/jsTest/kotlin/css/CSSBackgroundTests.kt

@ -143,4 +143,28 @@ class CSSBackgroundTests {
assertEquals("content-box", window.getComputedStyle(root.children[2] as HTMLElement).backgroundOrigin) assertEquals("content-box", window.getComputedStyle(root.children[2] as HTMLElement).backgroundOrigin)
} }
@Test
fun backgroundSize() = runTest {
composition {
Div({style {
backgroundSize("contain")
}})
Div({style {
backgroundSize("cover")
}})
Div({style {
backgroundSize("50%")
}})
Div({style {
backgroundSize("auto 50px")
}})
}
assertEquals("contain", window.getComputedStyle(root.children[0] as HTMLElement).backgroundSize)
assertEquals("cover", window.getComputedStyle(root.children[1] as HTMLElement).backgroundSize)
assertEquals("50%", window.getComputedStyle(root.children[2] as HTMLElement).backgroundSize)
assertEquals("auto 50px", window.getComputedStyle(root.children[3] as HTMLElement).backgroundSize)
}
} }
Loading…
Cancel
Save