JEST config for react project with mixed both JS and TS content

Question

I am very fresh as per testing. Some time ago I have configured some tests for purely TS React project. Now, I would like to do the same for React project with mixed JS and TS content. FYI, it is in the course of being rewritten to TS, but it will take some time. Below is my jest.config.ts file content.

import type { Config } from '@jest/types';

const config: Config.InitialOptions = {
    roots: ['<rootDir>/test', '<rootDir>/src'],
    transform: {
        '^.+\\.tsx?$': 'ts-jest',
        '^.+\\.css$': '<rootDir>/jest-config/style-mock.js',
    },
    setupFilesAfterEnv: ['@testing-library/jest-dom/extend-expect'],
    testRegex: '(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$',
    moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
    testEnvironment: 'jsdom',
    collectCoverage: false,
    collectCoverageFrom: ['src/**/*.{ts,tsx}'],
    moduleNameMapper: {
        '^.+\\.(css|sass|scss)$': 'identity-obj-proxy',
    },
};

export default config;

When firing first test, I have observed that it breaks on .js files. Precisely, the error text is '

SyntaxError: Unexpected token 'export

' And it pointed on certain file import declaration. When I rewrote temporarily this file content to TS faking it with anys etc.it accepted the file but broke on the next js. How should I modify the config to work well with such the mixture?

Below is also tsconfig.json:

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",
    "noFallthroughCasesInSwitch": true
  },
  "include": [
    "src"
  ]
}

and package.json

{
    "name": "google_books_finder",
    "homepage": "http://kiszuriwalilibori.github.io/books",
    "version": "1.4.2",
    "private": true,
    "dependencies": {
        "@babel/plugin-proposal-private-methods": "^7.10.4",
        "@babel/runtime-corejs3": "^7.11.2",
        "@material-ui/core": "^4.11.0",
        "@material-ui/icons": "^4.9.1",
        "@material-ui/lab": "^4.0.0-alpha.56",
        "@reduxjs/toolkit": "^1.7.1",
        "@testing-library/jest-dom": "^5.11.4",
        "@testing-library/react": "^11.0.4",
        "@testing-library/user-event": "^12.1.7",
        "@types/jest": "^27.0.2",
        "@types/node": "^16.11.6",
        "@types/react": "^17.0.33",
        "@types/react-dom": "^17.0.10",
        "axios": "^0.23.0",
        "comlink": "^4.3.0",
        "dotenv": "^8.2.0",
        "es6-promise": "^4.2.8",
        "es6-symbol": "^3.1.3",
        "eslint-plugin-jest-dom": "^4.0.1",
        "eslint-plugin-testing-library": "^5.0.3",
        "formik": "^2.2.9",
        "identity-obj-proxy": "^3.0.0",
        "jest": "^27.4.7",
        "lodash": "^4.17.21",
        "material-ui": "^0.20.2",
        "prop-types": "^15.7.2",
        "react": "^17.0.2",
        "react-app-polyfill": "^1.0.6",
        "react-dom": "^17.0.2",
        "react-hook-form": "^7.19.5",
        "react-query": "^3.27.0",
        "react-redux": "^7.2.1",
        "react-router-dom": "^5.2.0",
        "react-router-redux": "^4.0.8",
        "react-scripts": "^5.0.0",
        "redux": "^4.1.1",
        "redux-saga": "^1.1.3",
        "redux-thunk": "^2.3.0",
        "throttle-debounce": "^2.3.0",
        "ts-jest": "^27.1.3",
        "ts-node": "^10.4.0",
        "typescript": "^4.4.4",
        "use-debounce": "^5.0.1"
    },
    "scripts": {
        "start": "react-scripts start",
        "build": "react-scripts build",
        "test": "jest",
        "test:watch": "jest --watchAll",
        "eject": "react-scripts eject",
        "predeploy": "npm run build",
        "deploy": "gh-pages -d build"
    },
    "devDependencies": {
        "@babel/preset-stage-3": "^7.8.3",
        "@types/lodash": "^4.14.176",
        "@types/react-router-dom": "^5.3.2",
        "babel-plugin-styled-components": "^1.11.1",
        "gh-pages": "^3.2.3"
    },
    "eslintConfig": {
        "extends": "react-app"
    },
    "plugins": [
        "babel-plugin-styled-components",
        [
            "@babel/plugin-proposal-class-properties",
            {
                "loose": true
            }
        ]
    ],
    "browserslist": {
        "production": [
            ">0.2%",
            "not dead",
            "not op_mini all",
            "ie >= 11"
        ],
        "development": [
            "last 1 chrome version",
            "last 1 firefox version",
            "last 1 safari version",
            "ie >= 11"
        ]
    }
}