白色背景的动画无法正常工作

Question

我正在为按钮设置简单的动画。

@keyframes test {
  from {
    background-color: blue;
  }
  to {
    background-color: green;
  }
}

button {
  animation-name: test;
  animation-duration: 1s;
  animation-iteration-count: infinite;
}

<button style="width: 200px; height: 200px; background-color: white;">button</button>

按钮为白色背景时，动画是不可见的。当按钮具有红色背景色时，动画是可见的。为什么？