angular 当使用NgOptimizedImage进行单元测试组件时,控制台会出现警告,

q3qa4bjr  于 4个月前  发布在  Angular
关注(0)|答案(2)|浏览(44)

这是一个关于bug报告还是功能请求的问题?

  • Bug Report
  • Feature Request

请提供重现问题的步骤 [仅Bug Report]
ng test上运行组件时,控制台日志消息:

WARN: 'NG02956: The NgOptimizedImage directive (activated on an <img> 
element with the `ngSrc="https://static.learnlux.com/images/icons/star-circle-v1.0.png"`) 
has detected that there is no preconnect tag present for this image. 
Preconnecting to the origin(s) that serve priority images ensures that these 
images are delivered as soon as possible. To fix this, please add the 
following element into the <head> of the document: <link rel="preconnect" href="https://static.learnlux.com">

这个问题发生在每个涉及包含ngSrc指令的模板的单元测试中。
请提供您遇到的预期行为与实际行为 [仅Bug Report]
我希望在运行单元测试时禁用这些消息。
如果可能,请提供截图 [仅Bug Report]

  • 无响应*

请提供您看到的异常或错误 [仅Bug Report]

  • 无响应*

这是浏览器特定的问题吗?如果是,请指定设备、浏览器和版本。 [仅Bug Report]

  • 无响应*

功能请求的描述 [仅Feature Request]

  • 无响应*

功能请求的提议解决方案 [仅Feature Request]
我通过以下方式找到了解决这个错误的方法。有没有更好的方法来处理这个警告?我修复它的方式应该被记录下来吗?或者应该有一个NgOptimizedImageTesting模块,使得设置更容易?
功能请求中考虑的其他替代方案 [仅Feature Request]
我修改了karma.conf.js以加载包含预连接链接的DOM文件,以便在单元测试期间静默警告:

  • tests.html*
<link rel="preconnect" href="https://static.learnlux.com">
  • karma.conf.js*
module.exports = (config) => {
  config.set({
    files: [
      {
        pattern: './src/testing/tests.html',
        served: false,
        type: 'dom',
        watched: false,
      }
    ],

然而,由于karma.conf.js不再默认暴露给新的Angular应用,我认为这种方法对于每个人来说都很难设置。此外,这并没有将链接加载到<head>中,如警告中所指定的那样。我担心将来对该功能的改进也可能会对此表示不满。

uoifb46i

uoifb46i1#

teardown: { destroyAfterEach: true }(默认的TestBed配置)的情况下,也会为fill镜像出现这个错误。

WARN: 'NG02952: The NgOptimizedImage directive (activated on an <img> element with the `ngSrc="https://static.learnlux.com/logos/learnlux-staging-v2.0.png"`) has detected that the height of the fill-mode image is zero. This is likely because the containing element does not have the CSS 'position' property set to one of the following: "relative", "fixed", or "absolute". To fix this problem, make sure the container element has the CSS 'position' property defined and the height of the element is not zero.'

如果我设置了teardown: { destroyAfterEach: false },那么警告信息就会消失。

camsedfj

camsedfj2#

我不仅想在单元测试中禁用这个,而且因为我想使用自己的指令。

相关问题