Incorrect gutter icon placement in Webstorm / nextjs

[baggsie]

Hi,

I don't think the gutter icons are being correctly rendered on webstorm when using Nextjs (npx create-next-app@latest --example with-jest with-jest-app). I've tested using CRA and Wallaby seems to function correctly and I'm using the default Darcula theme.

As you can see in the image I'd expect L17 to be green, L18 to be red, and nothing on L21.

Test repo: https://github.com/baggsie/wallaby-next-pb

Wallaby diagnostics report

{
  editorVersion: 'WebStorm 2021.3.1',
  pluginVersion: '1.0.230',
  editorType: 'IntelliJ',
  osVersion: 'darwin 21.2.0',
  nodeVersion: 'v17.2.0',
  coreVersion: '1.0.1206',
  checksum: 'NWJiN2U5MThhOTJlZjAyYjkzNzRhNDMzOWUwODY5NDMsMTY0MzE1NTIwMDAwMCwx',
  config: {
    diagnostics: {
      jest: {
        config: {
          configs: [
            {
              automock: false,
              cache: true,
              cacheDirectory: '/private/var/folders/l3/2ptjv93n3hv6_n56tvb5x4lw0000gn/T/jest_dx',
              clearMocks: false,
              coveragePathIgnorePatterns: [ '/node_modules/' ],
              cwd: '<homeDir>/Documents/Sandpit/with-jest-app',
              dependencyExtractor: undefined,
              detectLeaks: false,
              detectOpenHandles: false,
              displayName: undefined,
              errorOnDeprecated: false,
              extensionsToTreatAsEsm: [],
              extraGlobals: [],
              filter: undefined,
              forceCoverageMatch: [],
              globalSetup: undefined,
              globalTeardown: undefined,
              globals: {},
              haste: { computeSha1: false, enableSymlinks: false, forceNodeFilesystemAPI: false, throwOnModuleCollision: false },
              injectGlobals: true,
              moduleDirectories: [ 'node_modules' ],
              moduleFileExtensions: [ 'js', 'jsx', 'ts', 'tsx', 'json', 'node' ],
              moduleLoader: undefined,
              moduleNameMapper: [
                [ '^.+\\.module\\.(css|sass|scss)$', '<homeDir>/Documents/Sandpit/with-jest-app/node_modules/next/dist/build/jest/object-proxy.js' ],
                [ '^.+\\.(css|sass|scss)$', '<homeDir>/Documents/Sandpit/with-jest-app/node_modules/next/dist/build/jest/__mocks__/styleMock.js' ],
                [ '^.+\\.(jpg|jpeg|png|gif|webp|avif|svg)$', '<homeDir>/Documents/Sandpit/with-jest-app/node_modules/next/dist/build/jest/__mocks__/fileMock.js' ],
                [ '^@/components/(.*)$', '<homeDir>/Documents/Sandpit/with-jest-app/components/$1' ],
                [ '^@/pages/(.*)$', '<homeDir>/Documents/Sandpit/with-jest-app/pages/$1' ]
              ],
              modulePathIgnorePatterns: [],
              modulePaths: undefined,
              name: 'dacbf1d269b5d4a8fdbb816cf1418e0a',
              prettierPath: 'prettier',
              resetMocks: false,
              resetModules: false,
              resolver: undefined,
              restoreMocks: false,
              rootDir: '<homeDir>/Documents/Sandpit/with-jest-app',
              roots: [ '<homeDir>/Documents/Sandpit/with-jest-app' ],
              runner: '<homeDir>/Documents/Sandpit/with-jest-app/node_modules/jest-runner/build/index.js',
              setupFiles: [],
              setupFilesAfterEnv: [ '<homeDir>/Documents/Sandpit/with-jest-app/jest.setup.js' ],
              skipFilter: false,
              skipNodeResolution: undefined,
              slowTestThreshold: 5,
              snapshotFormat: undefined,
              snapshotResolver: undefined,
              snapshotSerializers: [],
              testEnvironment: '<homeDir>/Documents/Sandpit/with-jest-app/node_modules/jest-environment-jsdom/build/index.js',
              testEnvironmentOptions: {},
              testLocationInResults: false,
              testMatch: [ '**/__tests__/**/*.[jt]s?(x)', '**/?(*.)+(spec|test).[tj]s?(x)' ],
              testPathIgnorePatterns: [ '/node_modules/', '/.next/' ],
              testRegex: [],
              testRunner: '<homeDir>/Documents/Sandpit/with-jest-app/node_modules/jest-circus/runner.js',
              testURL: 'http://localhost',
              timers: 'real',
              transform: [
                [
                  '^.+\\.(js|jsx|ts|tsx)$',
                  '<homeDir>/Documents/Sandpit/with-jest-app/node_modules/next/dist/build/swc/jest-transformer.js',
                  {
                    nextConfig: {
                      env: {},
                      webpack: null,
                      webpackDevMiddleware: null,
                      eslint: { ignoreDuringBuilds: false },
                      typescript: { ignoreBuildErrors: false, tsconfigPath: 'tsconfig.json' },
                      distDir: '.next',
                      cleanDistDir: true,
                      assetPrefix: '',
                      configOrigin: 'default',
                      useFileSystemPublicRoutes: true,
                      generateBuildId: [Function: generateBuildId],
                      generateEtags: true,
                      pageExtensions: [ 'tsx', 'ts', 'jsx', 'js' ],
                      target: 'server',
                      poweredByHeader: true,
                      compress: true,
                      analyticsId: '',
                      images: {
                        deviceSizes: [
                           640,  750,  828,
                          1080, 1200, 1920,
                          2048, 3840
                        ],
                        imageSizes: [
                          16,  32,  48,  64,
                          96, 128, 256, 384
                        ],
                        path: '/_next/image',
                        loader: 'default',
                        domains: [],
                        disableStaticImages: false,
                        minimumCacheTTL: 60,
                        formats: [ 'image/webp' ]
                      },
                      devIndicators: { buildActivity: true, buildActivityPosition: 'bottom-right' },
                      onDemandEntries: { maxInactiveAge: 15000, pagesBufferLength: 2 },
                      amp: { canonicalBase: '' },
                      basePath: '',
                      sassOptions: {},
                      trailingSlash: false,
                      i18n: null,
                      productionBrowserSourceMaps: false,
                      optimizeFonts: true,
                      webpack5: undefined,
                      excludeDefaultMomentLocales: true,
                      serverRuntimeConfig: {},
                      publicRuntimeConfig: {},
                      reactStrictMode: false,
                      httpAgentOptions: { keepAlive: true },
                      outputFileTracing: true,
                      staticPageGenerationTimeout: 60,
                      swcMinify: false,
                      experimental: {
                        cpus: 7,
                        sharedPool: true,
                        plugins: false,
                        profiling: false,
                        isrFlushToDisk: true,
                        workerThreads: false,
                        pageEnv: false,
                        optimizeImages: false,
                        optimizeCss: false,
                        scrollRestoration: false,
                        externalDir: false,
                        reactRoot: false,
                        disableOptimizedLoading: false,
                        gzipSize: true,
                        swcFileReading: true,
                        craCompat: false,
                        esmExternals: true,
                        isrMemoryCacheSize: 52428800,
                        concurrentFeatures: false,
                        serverComponents: false,
                        fullySpecified: false,
                        outputFileTracingRoot: '',
                        outputStandalone: false
                      },
                      configFileName: 'next.config.js'
                    },
                    jsConfig: {
                      compilerOptions: {
                        target: 1,
                        lib: [ 'lib.dom.d.ts', 'lib.dom.iterable.d.ts', 'lib.esnext.d.ts' ],
                        allowJs: true,
                        skipLibCheck: true,
                        strict: true,
                        forceConsistentCasingInFileNames: true,
                        noEmit: true,
                        esModuleInterop: true,
                        module: 99,
                        moduleResolution: 2,
                        resolveJsonModule: true,
                        isolatedModules: true,
                        jsx: 1,
                        incremental: true,
                        baseUrl: '<homeDir>/Documents/Sandpit/with-jest-app',
                        paths: { '@/components/*': [ 'components/*' ], '@/pages/*': [ 'pages/*' ], '@/styles/*': [ 'styles/*' ] },
                        pathsBasePath: '<homeDir>/Documents/Sandpit/with-jest-app',
                        configFilePath: undefined
                      }
                    },
                    resolvedBaseUrl: '<homeDir>/Documents/Sandpit/with-jest-app',
                    isEsmProject: false
                  }
                ]
              ],
              transformIgnorePatterns: [ '/node_modules/', '^.+\\.module\\.(css|sass|scss)$' ],
              unmockedModulePathPatterns: undefined,
              watchPathIgnorePatterns: []
            }
          ],
          globalConfig: {
            bail: 0,
            changedFilesWithAncestor: false,
            changedSince: undefined,
            collectCoverage: false,
            collectCoverageFrom: [],
            collectCoverageOnlyFrom: undefined,
            coverageDirectory: '<homeDir>/Documents/Sandpit/with-jest-app/coverage',
            coverageProvider: 'babel',
            coverageReporters: [ 'json', 'text', 'lcov', 'clover' ],
            coverageThreshold: undefined,
            detectLeaks: false,
            detectOpenHandles: false,
            errorOnDeprecated: false,
            expand: false,
            filter: undefined,
            findRelatedTests: false,
            forceExit: false,
            globalSetup: undefined,
            globalTeardown: undefined,
            json: false,
            lastCommit: false,
            listTests: false,
            logHeapUsage: false,
            maxConcurrency: 5,
            maxWorkers: 7,
            noSCM: undefined,
            noStackTrace: false,
            nonFlagArgs: undefined,
            notify: false,
            notifyMode: 'failure-change',
            onlyChanged: false,
            onlyFailures: false,
            outputFile: undefined,
            passWithNoTests: false,
            projects: [],
            replname: undefined,
            reporters: undefined,
            rootDir: '<homeDir>/Documents/Sandpit/with-jest-app',
            runTestsByPath: false,
            silent: undefined,
            skipFilter: false,
            snapshotFormat: undefined,
            testFailureExitCode: 1,
            testNamePattern: undefined,
            testPathPattern: '',
            testResultsProcessor: undefined,
            testSequencer: '<homeDir>/Documents/Sandpit/with-jest-app/node_modules/@jest/test-sequencer/build/index.js',
            testTimeout: undefined,
            updateSnapshot: 'new',
            useStderr: false,
            verbose: undefined,
            watch: false,
            watchAll: false,
            watchPlugins: undefined,
            watchman: true
          },
          hasDeprecationWarnings: false,
          wallaby: {
            roots: [],
            watchPathIgnorePatterns: [ '/node_modules/', '\\./dist/|\\./build/|\\./coverage/|\\./git/|/\\..+/', '/private/var/folders/l3/2ptjv93n3hv6_n56tvb5x4lw0000gn/T/jest_dx', '/.next/', '\\./coverage' ],
            testPathIgnorePatterns: [ '/node_modules/', '\\./dist/|\\./build/|\\./coverage/|\\./git/|/\\..+/', '/private/var/folders/l3/2ptjv93n3hv6_n56tvb5x4lw0000gn/T/jest_dx', '/.next/', '\\./coverage' ],
            testMatch: [ '**/__tests__/**/*.[jt]s?(x)', '**/?(*.)+(spec|test).[tj]s?(x)' ],
            testRegex: []
          }
        }
      }
    },
    testFramework: { version: 'jest@24.8.0', configurator: 'jest@24.8.0', reporter: 'jest@24.8.0', starter: 'jest@24.8.0', autoDetected: true },
    filesWithCoverageCalculated: [],
    filesWithNoCoverageCalculated: [],
    globalSetup: false,
    micromatch: true,
    files: [
      { pattern: '/node_modules/', regexp: /\/node_modules\//, ignore: true, trigger: true, load: true },
      { pattern: '\\./dist/|\\./build/|\\./coverage/|\\./git/|/\\..+/', regexp: /\.\/dist\/|\.\/build\/|\.\/coverage\/|\.\/git\/|\/\..+\//, ignore: true, trigger: true, load: true },
      {
        pattern: '/private/var/folders/l3/2ptjv93n3hv6_n56tvb5x4lw0000gn/T/jest_dx',
        regexp: /\/private\/var\/folders\/l3\/2ptjv93n3hv6_n56tvb5x4lw0000gn\/T\/jest_dx/,
        ignore: true,
        trigger: true,
        load: true
      },
      { pattern: '/.next/', regexp: /\/.next\//, ignore: true, trigger: true, load: true },
      { pattern: '\\./coverage', regexp: /\.\/coverage/, ignore: true, trigger: true, load: true },
      { pattern: '**/**', ignore: false, trigger: true, load: true, order: 1 },
      { pattern: '**/__tests__/**/*.[jt]s?(x)', ignore: true, trigger: true, load: true },
      { pattern: '**/?(*.)+(spec|test).[tj]s?(x)', ignore: true, trigger: true, load: true }
    ],
    tests: [
      { pattern: '/node_modules/', regexp: /\/node_modules\//, ignore: true, trigger: true, load: true, test: true },
      {
        pattern: '\\./dist/|\\./build/|\\./coverage/|\\./git/|/\\..+/',
        regexp: /\.\/dist\/|\.\/build\/|\.\/coverage\/|\.\/git\/|\/\..+\//,
        ignore: true,
        trigger: true,
        load: true,
        test: true
      },
      {
        pattern: '/private/var/folders/l3/2ptjv93n3hv6_n56tvb5x4lw0000gn/T/jest_dx',
        regexp: /\/private\/var\/folders\/l3\/2ptjv93n3hv6_n56tvb5x4lw0000gn\/T\/jest_dx/,
        ignore: true,
        trigger: true,
        load: true,
        test: true
      },
      { pattern: '/.next/', regexp: /\/.next\//, ignore: true, trigger: true, load: true, test: true },
      { pattern: '\\./coverage', regexp: /\.\/coverage/, ignore: true, trigger: true, load: true, test: true },
      { pattern: '**/__tests__/**/*.[jt]s?(x)', ignore: false, trigger: true, load: true, test: true, order: 2 },
      { pattern: '**/?(*.)+(spec|test).[tj]s?(x)', ignore: false, trigger: true, load: true, test: true, order: 3 }
    ],
    runAllTestsInAffectedTestFile: false,
    updateNoMoreThanOneSnapshotPerTestFileRun: false,
    addModifiedTestFileToExclusiveTestRun: true,
    compilers: {},
    preprocessors: {},
    maxConsoleMessagesPerTest: 100,
    autoConsoleLog: true,
    delays: { run: 0, edit: 100, update: 0 },
    workers: { initial: 0, regular: 0, recycle: false },
    teardown: undefined,
    hints: {
      ignoreCoverage: '__REGEXP /ignore coverage|istanbul ignore/',
      ignoreCoverageForFile: '__REGEXP /ignore file coverage/',
      commentAutoLog: '?',
      testFileSelection: { include: '__REGEXP /file\\.only/', exclude: '__REGEXP /file\\.skip/' }
    },
    automaticTestFileSelection: true,
    runSelectedTestsOnly: false,
    mapConsoleMessagesStackTrace: false,
    extensions: {},
    env: {
      type: 'node',
      params: {},
      runner: '<homeDir>/.nvm/versions/node/v17.2.0/bin/node',
      viewportSize: { width: 800, height: 600 },
      options: { width: 800, height: 600 },
      bundle: true
    },
    reportUnhandledPromises: true,
    slowTestThreshold: 75,
    lowCoverageThreshold: 80,
    loose: true,
    configCode: 'auto.detect#1505102802'
  },
  packageJSON: {
    dependencies: { next: 'latest', react: '^17.0.2', 'react-dom': '^17.0.2' },
    devDependencies: {
      '@testing-library/jest-dom': '5.16.1',
      '@testing-library/react': '12.1.2',
      '@testing-library/user-event': '13.5.0',
      '@types/react': '17.0.38',
      'babel-jest': '27.4.5',
      eslint: '8.5.0',
      'eslint-config-next': 'latest',
      'eslint-plugin-testing-library': '5.0.1',
      jest: '27.4.5',
      typescript: '4.5.4'
    }
  },
  fs: { numberOfFiles: 20 },
  debug: [
    '2022-01-11T19:35:04.767Z angular/cli config Angular CLI not found.\n',
    '2022-01-11T19:35:05.069Z jest/config Detected Jest.\n',
    '2022-01-11T19:35:05.070Z jest/config Configured Jest.\n',
    '2022-01-11T19:35:05.070Z project Wallaby Node version: v17.2.0\n',
    '2022-01-11T19:35:05.070Z project Wallaby config: <homeDir>/Documents/Sandpit/with-jest-app/auto.detect\n',
    '2022-01-11T19:35:05.102Z project File cache: <homeDir>/Library/Caches/JetBrains/WebStorm2021.3/wallaby/projects/54b7a2d4e4c7e5de\n',
    '2022-01-11T19:35:05.145Z uiService Listening port 51235\n',
    '2022-01-11T19:35:05.151Z workers Parallelism for initial run: 6, for regular run: 3\n',
    '2022-01-11T19:35:05.151Z workers Starting run worker instance #0\n',
    '2022-01-11T19:35:05.151Z workers Starting run worker instance #1\n',
    '2022-01-11T19:35:05.151Z workers Starting run worker instance #2\n',
    '2022-01-11T19:35:05.151Z workers Starting run worker instance #3\n',
    '2022-01-11T19:35:05.151Z workers Starting run worker instance #4\n',
    '2022-01-11T19:35:05.151Z workers Starting run worker instance #5\n',
    '2022-01-11T19:35:05.151Z workers Web server is listening at 55219\n',
    '2022-01-11T19:35:05.175Z project Stopping process pool\n',
    '2022-01-11T19:35:05.175Z project File cache is up-to-date, starting full test run\n',
    '2022-01-11T19:35:05.179Z project Test run started; run priority: 3\n',
    '2022-01-11T19:35:05.179Z project Running all tests\n',
    '2022-01-11T19:35:05.180Z workers Starting test run, priority: 3\n',
    '2022-01-11T19:35:05.180Z workers Distributing tests between 6 workers\n',
    '2022-01-11T19:35:05.181Z workers Running tests in parallel\n',
    '2022-01-11T19:35:05.181Z nodeRunner Starting sandbox [worker #0, session #r9hi5]\n',
    '2022-01-11T19:35:05.181Z nodeRunner Starting sandbox [worker #1, session #zodl9]\n',
    '2022-01-11T19:35:05.181Z nodeRunner Preparing sandbox [worker #0, session #r9hi5]\n',
    '2022-01-11T19:35:05.181Z nodeRunner Preparing sandbox [worker #1, session #zodl9]\n',
    '2022-01-11T19:35:05.289Z workers Started run worker instance (delayed) #0\n',
    '2022-01-11T19:35:05.290Z nodeRunner Prepared sandbox [worker #0, session #r9hi5]\n',
    '2022-01-11T19:35:05.290Z workers [worker #0, session #r9hi5] Running tests in sandbox\n',
    '2022-01-11T19:35:05.300Z workers Started run worker instance (delayed) #4\n',
    '2022-01-11T19:35:05.300Z workers Started run worker instance (delayed) #3\n',
    '2022-01-11T19:35:05.302Z workers Started run worker instance (delayed) #5\n',
    '2022-01-11T19:35:05.304Z workers Started run worker instance (delayed) #2\n',
    '2022-01-11T19:35:05.304Z workers Started run worker instance (delayed) #1\n',
    '2022-01-11T19:35:05.304Z nodeRunner Prepared sandbox [worker #1, session #zodl9]\n',
    '2022-01-11T19:35:05.305Z workers [worker #1, session #zodl9] Running tests in sandbox\n',
    '2022-01-11T19:35:06.378Z workers Scheduling Jest Test Run (zodl9): 2022-01-11T19:35:05.825Z\n',
    '2022-01-11T19:35:06.379Z workers [zodl9] Loaded unknown number of test(s)\n',
    '2022-01-11T19:35:06.379Z workers [zodl9] Test executed: renders homepage unchanged\n',
    '2022-01-11T19:35:06.380Z workers [zodl9] Run 1 test(s), skipped 0 test(s)\n',
    '2022-01-11T19:35:06.380Z workers Jest Test Run Complete (zodl9): 2022-01-11T19:35:06.377Z\n',
    '2022-01-11T19:35:06.380Z workers [zodl9] Sandbox is responsive, closing it\n',
    '2022-01-11T19:35:06.417Z workers Scheduling Jest Test Run (r9hi5): 2022-01-11T19:35:05.825Z\n',
    '2022-01-11T19:35:06.417Z workers [r9hi5] Loaded unknown number of test(s)\n',
    '2022-01-11T19:35:06.417Z workers [r9hi5] Test executed: renders a heading\n',
    '2022-01-11T19:35:06.418Z workers [r9hi5] Test executed: should sum two numbers\n',
    '2022-01-11T19:35:06.419Z workers [r9hi5] Run 2 test(s), skipped 0 test(s)\n',
    '2022-01-11T19:35:06.419Z workers Jest Test Run Complete (r9hi5): 2022-01-11T19:35:06.416Z\n',
    '2022-01-11T19:35:06.420Z workers [r9hi5] Sandbox is responsive, closing it\n',
    '2022-01-11T19:35:06.420Z workers Merging parallel test run results\n',
    '2022-01-11T19:35:06.420Z project Test run finished\n',
    '2022-01-11T19:35:06.420Z project Processed console.log entries\n',
    '2022-01-11T19:35:06.420Z project Processed loading sequences\n',
    '2022-01-11T19:35:06.421Z project Processed executed tests\n',
    '2022-01-11T19:35:06.421Z project Processed code coverage\n',
    '2022-01-11T19:35:06.428Z project Test run result processed and sent to IDE\n',
    '2022-01-11T19:38:19.603Z fs No metadata for added file found: .git/config\n',
    '2022-01-11T19:38:19.603Z fs File changed: .git/config\n',
    '2022-01-11T19:38:19.603Z fs No metadata for changed file found: .git/config\n',
    '2022-01-11T19:38:27.779Z fs No metadata for added file found: .git/logs/HEAD\n',
    '2022-01-11T19:38:27.780Z fs No metadata for added file found: .git/refs/heads/main\n',
    '2022-01-11T19:38:27.780Z fs No metadata for added file found: .git/logs/refs/heads/main\n',
    '2022-01-11T19:38:27.780Z fs File changed: .git/refs/heads/main\n',
    '2022-01-11T19:38:27.780Z fs No metadata for changed file found: .git/refs/heads/main\n',
    '2022-01-11T19:38:27.881Z fs No metadata for added file found: .git/HEAD\n',
    '2022-01-11T19:38:27.881Z fs File changed: .git/HEAD\n',
    '2022-01-11T19:38:27.881Z fs No metadata for changed file found: .git/HEAD\n',
    '2022-01-11T19:38:27.881Z fs File changed: .git/config\n',
    '2022-01-11T19:38:27.881Z fs No metadata for changed file found: .git/config\n',
    '2022-01-11T19:38:40.795Z fs File changed: .git/config\n',
    '2022-01-11T19:38:40.795Z fs No metadata for changed file found: .git/config\n',
    '2022-01-11T19:38:40.795Z fs No metadata for added file found: .git/logs/refs/remotes/origin/main\n',
    '2022-01-11T19:38:40.795Z fs No metadata for added file found: .git/refs/remotes/origin/main\n'
  ]
}

[smcenlly]

Your project is using next/jest, which is currently experimental. (see https://nextjs.org/docs/messages/experimental-jest-transformer​​).

We have identified that your problem is caused by incorrect settings being provided as part of the next/jest transformer. We have suggested that these settings be updated as part of next/jest support.

While this is not a Wallaby issue, we have applied a patch to Wallaby to explicitly update these settings for you which will fix your problem.

If you update to the latest version of Wallaby (v1.0.1207), it should work for you.

[baggsie]

Thanks for your help.