Next.js 14.x: Synchronous function becomes async during runtime

[stefan-girlich]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Self-hosted/on-premise

Which SDK are you using?

@sentry/nextjs

SDK Version

10.32.1

Framework Version

Next 14.2.35

Link to Sentry event

No response

Reproduction Example/SDK Setup

sentry.common.config.js

// sentry.common.config.js
import * as Sentry from '@sentry/nextjs'

export const getSentryConfig = ():
  | Sentry.BrowserOptions
  | Sentry.NodeOptions
  | Sentry.EdgeOptions => {
  const dsn = process.env.SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN
  const environment = process.env.SENTRY_ENV || process.env.NEXT_PUBLIC_SENTRY_ENV
  const enabled = !!environment // disable for local development
  const tracesSampleRate = 0.0001
  return {
    enabled,
    dsn,
    environment,
    tracesSampleRate,
  }
}

// sentry.edge.config.js and sentry.server.config.js

import * as Sentry from '@sentry/nextjs'

import { getSentryConfig } from './sentry.common.config'

Sentry.init({
...getSentryConfig(),

// Setting this option to true will print useful information to the console while you're setting up Sentry.
debug: false,
})

next.config.mjs

// next.config.mjs
import bundleAnalyzer from '@next/bundle-analyzer'
import { withSentryConfig } from '@sentry/nextjs'
import path from 'path'
import { fileURLToPath } from 'url'

const __filename = fileURLToPath(import.meta.url)
const __dirname = path.dirname(__filename)

/* code depending on isProd disable Sentry in dev mode 
to prevent hot reloads taking very long. 
Inspired by https://gist.github.com/MirzaLeka/d709d0925d9b749d1b9068abf4b5ad50?permalink_comment_id=5857941#gistcomment-5857941
*/

const isProd = process.env.NODE_ENV === 'production'

const withBundleAnalyzer = bundleAnalyzer({
  enabled: process.env.ANALYZE === 'true',
})

const nextOptions = {
  // ...
  webpack(config) {
    // ...

    // silence dev server warning when Sentry is not initialized
    if (!isProd) config.externals.push('require-in-the-middle')

    // Add Sentry server action instrumentation loader
    if (isProd) {
      config.module.rules.push({
        test: /\.(ts|js)$/,
        include: /src/,
        use: [
          {
            loader: path.resolve(
              __dirname,
              'scripts/webpack-loaders/sentry-server-action-loader.js'
            ),
          },
        ],
      })
    }

    // ...

    return config
  },
  productionBrowserSourceMaps: process.env.CREATE_SOURCE_MAPS === '1' || false,
}

const sentryOptions = {
  org: '...',
  project: '...',
  sentryUrl: '...',

  silent: !process.env.CI,
  widenClientFileUpload: true,
  reactComponentAnnotation: {
    enabled: true,
  },
  tunnelRoute: '/monitoring',
  disableLogger: true,
  automaticVercelMonitors: false,
}

const config = isProd
  ? withSentryConfig(withBundleAnalyzer(nextOptions), sentryOptions)
  : withBundleAnalyzer(nextOptions)
export default config

Steps to Reproduce

1. Define Next.js server-side code (use server) without async, just a synchronous function returning a result, e.g. a string
2. Call the function in Next.js server-side code, e.g. route handler or server action

Example:

'use server'

import { headers } from 'next/headers'

const getReferer = () => {
  const referer = headers().get('Referer')
  return referer
}

export default getReferer

Expected Result

Next.js converts synchronous server-action functions to async functions silently. This seems to cause errors in recent Next.js versions by design, but is still fine in Next 14.2.35:

Without Sentry (isProd = false), I can call my function (i.e. getReferer) synchronously without any problems.

Actual Result

If Sentry is initialized, the function that returns a string in the code returns a Promise at runtime.

Additional Context

No response

Priority

_{React with 👍 to help prioritize this issue. Please use comments to provide useful context, avoiding +1 or me too, to help us triage it.}

[linear]

JS-1428

[logaretm]

Perhaps I misunderstood, but can you elaborate how does the Sentry SDK cause this behavior? We don't wrap any server actions by default and you have to manually wrap them with Sentry.withServerActionInstrumentation.

I tried a simple Next.js 15 app with a sync server action and the error got logged regardless of Sentry SDK being installed or not. The issue you linked suggests that this is an expected behavior and something to keep in mind when upgrading to later Next.js versions.

Happy to help once I learn more about your issue.

[stefan-girlich]

After deeper investigation, I am sure a custom webpack loader in my project (which does apply Sentry.withServerActionInstrumentation) is responsible for the issue.

Closing this issue, thanks for your quick response!