Browse Source

Introduce CSSUnitApiTests and slightly modify API according to the results of such testing

pull/756/head
Shagen Ogandzhanian 3 years ago
parent
commit
de42b05b99
  1. 8
      web/core/src/jsMain/kotlin/androidx/compose/web/css/CSS.kt
  2. 12
      web/core/src/jsMain/kotlin/androidx/compose/web/css/CSSUnits.kt
  3. 124
      web/core/src/jsTest/kotlin/CSSUnitApiTests.kt

8
web/core/src/jsMain/kotlin/androidx/compose/web/css/CSS.kt

@ -368,23 +368,15 @@ external class CSS {
fun em(value: Number): CSSemValue
fun ex(value: Number): CSSexValue
fun ch(value: Number): CSSchValue
fun ic(value: Number): CSSicValue
fun rem(value: Number): CSSremValue
fun lh(value: Number): CSSlhValue
fun rlh(value: Number): CSSrlhValue
fun vw(value: Number): CSSvwValue
fun vh(value: Number): CSSvhValue
fun vi(value: Number): CSSviValue
fun vb(value: Number): CSSvbValue
fun vmin(value: Number): CSSvminValue
fun vmax(value: Number): CSSvmaxValue
fun cm(value: Number): CSScmValue
fun mm(value: Number): CSSmmValue
fun Q(value: Number): CSSQValue
// function _in(value: Number) : CSSUnitValue
// export
// { _in as in }
fun pt(value: Number): CSSptValue
fun pc(value: Number): CSSpcValue
fun px(value: Number): CSSpxValue

12
web/core/src/jsMain/kotlin/androidx/compose/web/css/CSSUnits.kt

@ -60,22 +60,12 @@ val Number.ex
get(): CSSexValue = CSS.ex(this)
val Number.ch
get(): CSSchValue = CSS.ch(this)
val Number.ic
get(): CSSicValue = CSS.ic(this)
val Number.rem
val Number.cssRem
get(): CSSremValue = CSS.rem(this)
val Number.lh
get(): CSSlhValue = CSS.lh(this)
val Number.rlh
get(): CSSrlhValue = CSS.rlh(this)
val Number.vw
get(): CSSvwValue = CSS.vw(this)
val Number.vh
get(): CSSvhValue = CSS.vh(this)
val Number.vi
get(): CSSviValue = CSS.vi(this)
val Number.vb
get(): CSSvbValue = CSS.vb(this)
val Number.vmin
get(): CSSvminValue = CSS.vmin(this)
val Number.vmax

124
web/core/src/jsTest/kotlin/CSSUnitApiTests.kt

@ -0,0 +1,124 @@
/*
* Copyright 2020-2021 JetBrains s.r.o. and respective authors and developers.
* Use of this source code is governed by the Apache 2.0 license that can be found in the LICENSE.txt file.
*/
package org.jetbrains.compose.web.core.tests
import org.jetbrains.compose.web.css.CSS
import org.jetbrains.compose.web.css.CSSUnitValue
import org.jetbrains.compose.web.css.ch
import org.jetbrains.compose.web.css.cm
import org.jetbrains.compose.web.css.cssRem
import org.jetbrains.compose.web.css.deg
import org.jetbrains.compose.web.css.dpcm
import org.jetbrains.compose.web.css.dpi
import org.jetbrains.compose.web.css.dppx
import org.jetbrains.compose.web.css.em
import org.jetbrains.compose.web.css.fr
import org.jetbrains.compose.web.css.grad
import org.jetbrains.compose.web.css.mm
import org.jetbrains.compose.web.css.ms
import org.jetbrains.compose.web.css.number
import org.jetbrains.compose.web.css.pc
import org.jetbrains.compose.web.css.percent
import org.jetbrains.compose.web.css.pt
import org.jetbrains.compose.web.css.px
import org.jetbrains.compose.web.css.rad
import org.jetbrains.compose.web.css.s
import org.jetbrains.compose.web.css.turn
import org.jetbrains.compose.web.css.vh
import org.jetbrains.compose.web.css.vmax
import org.jetbrains.compose.web.css.vmin
import org.jetbrains.compose.web.css.vw
import kotlin.test.Test
import kotlin.test.assertEquals
class CSSUnitApiTests {
// TODO: Cover CSS.Q, CSS.khz and CSS.hz after we'll get rid from polyfill
private fun CSSUnitValue.assertStructure(value: Number, unit: String, description: String? = null) {
assertEquals(this.value, value, description)
assertEquals(this.unit, unit, description)
}
// TODO: use regular assertEqual after we'll get rid from polyfill
private fun CSSUnitValue.assertStructure(otherUnit: CSSUnitValue, description: String? = null) {
return assertStructure(otherUnit.value, otherUnit.unit, description)
}
@Test
fun builderInvocation() {
CSS.number(4).assertStructure(4, "number")
CSS.percent(4).assertStructure(4, "percent")
CSS.em(4).assertStructure(4, "em")
CSS.ch(4).assertStructure(4, "ch")
CSS.rem(4).assertStructure(4, "rem")
CSS.vw(4).assertStructure(4, "vw")
CSS.vh(4).assertStructure(4, "vh")
CSS.vmin(4).assertStructure(4, "vmin")
CSS.vmax(4).assertStructure(4, "vmax")
CSS.cm(4).assertStructure(4, "cm")
CSS.mm(4).assertStructure(4, "mm")
CSS.pt(4).assertStructure(4, "pt")
CSS.pc(4).assertStructure(4, "pc")
CSS.px(4).assertStructure(4, "px")
CSS.deg(4).assertStructure(4, "deg")
CSS.grad(4).assertStructure(4, "grad")
CSS.rad(4).assertStructure(4, "rad")
CSS.turn(4).assertStructure(4, "turn")
CSS.s(4).assertStructure(4, "s")
CSS.ms(4).assertStructure(4, "ms")
CSS.dpi(4).assertStructure(4, "dpi")
CSS.dpcm(4).assertStructure(4, "dpcm")
CSS.dppx(4).assertStructure(4, "dppx")
CSS.fr(4).assertStructure(4, "fr")
}
@Test
fun postfixInvocation() {
4.number.assertStructure(CSS.number(4), "number postfix")
4.percent.assertStructure(CSS.percent(4), "percent posfix")
4.em.assertStructure(CSS.em(4), "em postfix")
4.ch.assertStructure(CSS.ch(4), "ch postfix")
4.cssRem.assertStructure(CSS.rem(4))
4.vw.assertStructure(CSS.vw(4),"vw postfix")
4.vh.assertStructure(CSS.vh(4), "vh postfix")
4.vmin.assertStructure(CSS.vmin(4), "vmin postfix")
4.vmax.assertStructure(CSS.vmax(4), "vmax postfix")
4.cm.assertStructure(CSS.cm(4), "cm postfix")
4.mm.assertStructure(CSS.mm(4), "mm postfix")
4.pt.assertStructure(CSS.pt(4), "pt postfix")
4.pc.assertStructure(CSS.pc(4), "pc postfix")
4.px.assertStructure(CSS.px(4), "px postfix")
4.deg.assertStructure(CSS.deg(4), "deg postfix")
4.grad.assertStructure(CSS.grad(4), "grad postfix")
4.rad.assertStructure(CSS.rad(4), "rad postfix")
4.turn.assertStructure(CSS.turn(4), "turn postfix")
4.s.assertStructure(CSS.s(4), "s postfix")
4.ms.assertStructure(CSS.ms(4), "ms postfix")
4.dpi.assertStructure(CSS.dpi(4), "dpi postfix")
4.dpcm.assertStructure(CSS.dpcm(4), "dpcm postfix")
4.dppx.assertStructure(CSS.dppx(4), "dppx postfix")
4.fr.assertStructure(CSS.fr(4), "fr postfix")
}
}
Loading…
Cancel
Save