使用 CSS 对 font-feature-settings 进行动画处理在 Safari 中不起作用

问：

我想使用 CSS 关键帧更改具有不同样式集的字体的字体功能设置。我在同一网页上的动画之外使用不同的字体功能设置，这在 Chrome 和 Safari 中都适用。我还使用CSS关键帧动画，这在Safari中也可以正常工作。但是，当我尝试对 font-feature-settings 进行动画处理时，Safari 让我失望了。

这是我的CSS：

.animate {
  animation: animateFont 2s linear infinite;
}

@keyframes animateFont {
  0% {
    font-feature-settings: "ss01" 1;
    -webkit-font-feature-settings: "ss01" 1;
    -moz-font-feature-settings:    "ss01" 1;
    -ms-font-feature-settings:     "ss01" 1;
    color: white;
  }
  50% {
    font-feature-settings: "ss02" 1;
    -webkit-font-feature-settings: "ss02" 1;
    -moz-font-feature-settings:    "ss02" 1;
    -ms-font-feature-settings:     "ss02" 1;
    color: red;
  }
  100% {
    font-feature-settings: "ss01" 1;
    -webkit-font-feature-settings: "ss01" 1;
    -moz-font-feature-settings:    "ss01" 1;
    -ms-font-feature-settings:     "ss01" 1;
    color: white;
  }
}

我发现很多关于动画的东西通常在 Safari 中不起作用，但没有专门针对字体功能设置的东西。有谁知道CSS方法可以使它工作？

编辑：这是一个连字动画的例子，它在Chrome中有效，但在Safari中无效。

.animate-font {
  animation: animateFont 2s linear infinite;
  font-size: 100px;
}

@keyframes animateFont {
  0% {
    font-feature-settings: "smcp" 1;
    -webkit-font-feature-settings: "smcp" 1;
    -moz-font-feature-settings: "smcp" 1;
    -ms-font-feature-settings: "smcp" 1;
  }
  50% {
    font-feature-settings: "liga" 0;
    -webkit-font-feature-settings: "liga" 0;
    -moz-font-feature-settings: "liga" 0;
    -ms-font-feature-settings: "liga" 0;
  }
  100% {
    font-feature-settings: "ss01" 1;
    -webkit-font-feature-settings: "ss01" 1;
    -moz-font-feature-settings: "ss01" 1;
    -ms-font-feature-settings: "ss01" 1;
  }
}

<div class="animate-font">
  fi
</div>