Css @supports

주어진 하나의 이상의 CSS 기능을 브라우저가 지원하는지에 따라 다른 스타일을 선언할 수 있는 방법을 제공한다. 기능 쿼리(feature query)라고 부른다.

ex)

@supports (display: grid){
	div{
		display: grid;
	}
}

@supports not (display: grid) {
  div {
    float: right;
  }
}

and 연산자를 이용할 수 있다.(or도 사용 가능)

@supports (display: table-cell) and (display: list-item) and (display: run-in) {
}
@supports (display: table-cell) and ((display: list-item) and (display: run-in)) {
}

참고)

• https://developer.mozilla.org/ko/docs/Web/CSS/@supports

테스트 대역(더블)

테스트에서 실제 객체 대신 테스트를 위한 객체를 뜻한다. 테스트 할 대상이 아닌 경우에 테스트 대역을 써서 테스트할 대상에 집중할 수 있도록 해준다.

더미(dummy)

사용되지 않는 객체. 인스턴스의 객체만 필요하고 객체를 사용하지 않는 경우에 사용한다.

Ex) 테스트하는데 사용하지 않는 생성자에 전달해야하는 객체.

스텁(stub)

Dummy 객체가 작동하도록 만든 객체. 실제로 작동 로직을 가지고 작동하는 것은 아니고 정해진 값만 반환한다.

스파이(spy)

어떤 객체의 함수를 가짜로 대체하지 않고, 해당 함수의 호출 여부와 어떻게 호출되는지 알고 싶을 때 사용하는 객체.

모의객체(Mock)

실제 객체로 테스트 할 수 없는 이유가 있을 때 사용한다.(비용이나 시간이 많이 드는 경우) 모의 객체는 메서드의 응답을 설정하여 사용.(스텁 같은 역할) 모의 객체는 모든 상호작용을 저장해서 나중에 단언문에 활용할 수 있도록 해준다.(테스트 단정문을 가지고 있는 객체.)