error in render function react testing library

I am trying to start using the react testing library in my next js project. I looked at it many times and all things seem correct as tutorials. i just have this error in my test util. error:

TypeError: React.createElement is not a function
 return render(ui, { wrapper: Providers, ...options })

testutil.js :

import { render } from '@testing-library/react';
const Providers = ({ children }) => {
return children
}
const customRender = (ui, options = {}) =>{
return render(ui, { wrapper: Providers, ...options })
}
export * from '@testing-library/react'
export { customRender as render }

jest.config.js

module.exports = {
setupFilesAfterEnv: ['./jest.setup.js'],
roots: ['<rootDir>'],
moduleFileExtensions: ['ts', 'tsx', 'js', 'json', 'jsx'],
testPathIgnorePatterns: ['<rootDir>[/\\\\](node_modules|.next)[/\\\\]'],
transformIgnorePatterns: ['[/\\\\]node_modules[/\\\\].+\\.(ts|tsx)$'],
transform: {
    '^.+\\.(js|jsx|ts|tsx)$': '<rootDir>/node_modules/babel-jest',
    // '.+\\.(css|styl|less|sass|scss|jpg|ttf|woff|woff2)$': 'identity-obj-proxy',
    // '.+\\.png$': require.resolve('./assets/image/download.png'),
},
moduleDirectories: ['node_modules', './'],
watchPlugins: [
    'jest-watch-typeahead/filename',
    'jest-watch-typeahead/testname',
],
moduleNameMapper: { '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/assetsTransformer.js', '\\.(css|less)$': '<rootDir>/assetsTransformer.js' },

};

jest.setup.js

import '@testing-library/jest-dom/extend-expect';
require('jest-canvas-mock');
 process.env = {
...process.env,
__NEXT_IMAGE_OPTS: {
    deviceSizes: [320, 420, 768, 1024, 1200],
    imageSizes: [],
    domains: ['images.example.com'],
    path: '/_next/image',
    loader: 'default',
},
  };