Question

使用样式化组件时，我一直在努力使用 Jest 进行测试。

我从styled-components / jest中获取了示例代码

import * as React from 'react'
import styled from 'styled-components'
import * as TestRenderer from 'react-test-renderer'
import 'jest-styled-components'

const Button = styled.button`
  color: red;
`

test('it works', () => {
  const tree = TestRenderer.create(<Button />).toJSON()
  expect(tree).toMatchSnapshot()
  expect(tree).toHaveStyleRule('color', 'red')
})

我总是出现以下错误：

 Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

测试文件是.tsx。开玩笑的配置如下：

module.exports = {
    "roots": [
        "<rootDir>/src"
    ],
    "transform": {
        "^.+\\.tsx?$": "ts-jest"
    },
    "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$",
    "moduleFileExtensions": [
        "ts",
        "tsx",
        "js",
        "jsx",
        "json",
        "node"
    ]
}

Answer 1

好吧，最终我最终使用酶进行了测试。并没有真正解决这个问题，但是设法使其起作用。

还决定不使用+ pip install -r requirements-test.txt Requirement already satisfied: coverage==4.5.1 in ./.heroku/python/lib/python3.6/site-packages (from -r requirements-test.txt (line 1)) Requirement already satisfied: selenium==3.141.0 in ./.heroku/python/lib/python3.6/site-packages (from -r requirements-test.txt (line 2)) Requirement already satisfied: urllib3 in ./.heroku/python/lib/python3.6/site-packages (from selenium==3.141.0->-r requirements-test.txt (line 2)) You are using pip version 9.0.2, however version 18.1 is available. You should consider upgrading via the 'pip install --upgrade pip' command. + python manage.py collectstatic --no-input Traceback (most recent call last): File "manage.py", line 20, in <module> execute_from_command_line(sys.argv) File "/app/.heroku/python/lib/python3.6/site-packages/django/core/management/__init__.py", line 381, in execute_from_command_line utility.execute() File "/app/.heroku/python/lib/python3.6/site-packages/django/core/management/__init__.py", line 357, in execute django.setup() File "/app/.heroku/python/lib/python3.6/site-packages/django/__init__.py", line 24, in setup apps.populate(settings.INSTALLED_APPS) File "/app/.heroku/python/lib/python3.6/site-packages/django/apps/registry.py", line 120, in populate app_config.ready() File "/app/.heroku/python/lib/python3.6/site-packages/django/contrib/admin/apps.py", line 24, in ready self.module.autodiscover() File "/app/.heroku/python/lib/python3.6/site-packages/django/contrib/admin/__init__.py", line 26, in autodiscover autodiscover_modules('admin', register_to=site) File "/app/.heroku/python/lib/python3.6/site-packages/django/utils/module_loading.py", line 47, in autodiscover_modules import_module('%s.%s' % (app_config.name, module_to_search)) File "/app/.heroku/python/lib/python3.6/importlib/__init__.py", line 126, in import_module return _bootstrap._gcd_import(name[level:], package, level) File "<frozen importlib._bootstrap>", line 994, in _gcd_import File "<frozen importlib._bootstrap>", line 971, in _find_and_load File "<frozen importlib._bootstrap>", line 955, in _find_and_load_unlocked File "<frozen importlib._bootstrap>", line 665, in _load_unlocked File "<frozen importlib._bootstrap_external>", line 678, in exec_module File "<frozen importlib._bootstrap>", line 219, in _call_with_frames_removed File "/app/core/admin.py", line 8, in <module> from .forms import CrmDataUploadForm File "/app/core/forms.py", line 3, in <module> from magic import magic ImportError: cannot import name 'magic'，因为最新版本本身就有一些麻烦。希望我以后能解决。

jest-styled-components

不用说，您必须更新import * as React from 'react' import styled from 'styled-components' const Button = styled.button` color: red; ` test('it works', () => { const tree = shallow(<Button />); expect(tree).toMatchSnapshot() })才能使jest.config.js正常工作：

shallow

不变违规：元素类型无效（Jest + TSX + StyledComponents）

1 个答案: