Question

我开始在Angular应用程序中使用karma，并希望将浏览器主题更改为黑暗。我想知道配置文件中是否有任何地方我可以注入简单的css或使用添加js文件来注入这些样式。

e.g。果报styles.js

var css = `
  html * {
    background-color: black !important;
    color: white !important;
  }

  .html-reporter .failures .spec-detail .description {
    background-color: #b03911 !important;
  }
`,
head = document.head || document.getElementsByTagName('head')[0],
style = document.createElement('style');

style.type = 'text/css';
if (style.styleSheet){
style.styleSheet.cssText = css;
} else {
    style.appendChild(document.createTextNode(css));
}

我尝试在karma配置中添加文件： //要在浏览器中加载的文件/模式列表档案：[ ” ./karma-styles.js'， ]，

但似乎无法使其正常工作或不确定这是否是添加此文件的合适位置。

有没有人知道如何通过黑暗主题或插件来获得可以做到这一点的自定义样式？

Answer 1

我为此寻找了预制款式，但却找不到任何这样的款式，并以karma.css // list of files / patterns to load in the browser files: [ 'karma.css' ]发布。

Karma允许您将文件添加到其配置中，这允许插入CSS或JS。 GitHub Gist

<link type="text/css" href="base/karma.css" rel="stylesheet">

这些是相对于配置的，如果您使用Source的默认设置，它将是项目的根目录。

值得注意的是，这仅适用于iframe的内容，因此我不需要使用适当的插件来执行此操作，而是使用以下行直接编辑节点模块中的源HTML文件：

base

您可以在路径/node_modules/karma/static/client*.html找到上述配置添加的CSS文件。您应编辑的2个文件（通常）在此处：<?php namespace XXX\CheckoutAdditionalFields\Model\Plugin\Checkout; class LayoutProcessor { /** * @param \Magento\Checkout\Block\Checkout\LayoutProcessor $subject * @param array $jsLayout * @return array */ public function afterProcess( \Magento\Checkout\Block\Checkout\LayoutProcessor $subject, array $jsLayout ) { $jsLayout['components']['checkout']['children']['steps']['children']['shipping-step']['children']['shippingAddress']['children']['shipping-address-fieldset']['children']['date-of-birth'] = [ 'component' => 'Magento_Ui/js/form/element/abstract', 'config' => [ 'customScope' => 'shippingAddress', 'template' => 'ui/form/field', 'elementTmpl' => 'ui/form/element/date', 'options' => [], 'id' => 'date-of-birth' ], 'dataScope' => 'shippingAddress.date-of-birth', 'label' => 'Birthdate', 'provider' => 'checkoutProvider', 'visible' => true, 'validation' => [], 'sortOrder' => 250, 'id' => 'date-of-birth' ]; return $jsLayout; } }。我怀疑相对链接在这里可以正常工作（不能自由使用..但可以进入子目录）。

我怎样才能让karma浏览器使用黑暗主题？

1 个答案: