How to use auth emulator alongside service worker?

[Demianeen]

I was going through the Integrate Firebase with a Next.js app tutorial to connect my Next.js app with firebase. As far as I understand, it is recommended to use auth emulator for development. So, I tried to connect firebase in service worker, but apparently service worker restricted to same origin policy, so I can't connect to auth emulator that is running on 127.0.0.1:9099. Is it possible to connect auth emulator. Or is there other recommended way for local development?

Browser logs:

GET http://localhost:3000/en/sign-up 500 (Internal Server Error)
auth-service-worker.js:28 fetch for http://localhost:3000/_next/static/chunks/webpack.js
auth-service-worker.js:89 config ...
8The FetchEvent for "<URL>" resulted in a network error response: the promise was rejected.
auth-service-worker.js:28 fetch for http://localhost:3000/_next/static/chunks/main.js
auth-service-worker.js:89 config ...
auth-service-worker.js:28 fetch for http://localhost:3000/_next/static/chunks/react-refresh.js
auth-service-worker.js:89 config ...
3assert.ts:146 Uncaught (in promise) FirebaseError: Firebase: Error (auth/emulator-config-failed).
    at tn (assert.ts:146:55)
    at l (assert.ts:177:11)
    at nt (emulator.ts:50:3)
    at fc (auth-service-worker.js:94:2)
tn @ assert.ts:146
l @ assert.ts:177
nt @ emulator.ts:50
fc @ auth-service-worker.js:94
Show 3 more frames
Show less
sign-up:1 
        
        
       GET http://localhost:3000/_next/static/chunks/main.js net::ERR_FAILED
auth-service-worker.js:28 fetch for http://localhost:3000/_next/static/chunks/pages/_app.js
auth-service-worker.js:89 config {apiKey: '...', authDomain: '...', projectId: '...', appId: '...'}
auth-service-worker.js:28 fetch for http://localhost:3000/_next/static/chunks/pages/_error.js
auth-service-worker.js:89 config {apiKey: '...', authDomain: '...', projectId: '...', appId: '...'}
auth-service-worker.js:28 fetch for http://localhost:3000/_next/static/development/_buildManifest.js
auth-service-worker.js:89 config {apiKey: '...', authDomain: '...', projectId: '...', appId: '...'}
auth-service-worker.js:28 fetch for http://localhost:3000/_next/static/development/_ssgManifest.js
auth-service-worker.js:89 config {apiKey: '...', authDomain: '...', projectId: '...', appId: '...'}
sign-up:1 
        
        
       GET http://localhost:3000/_next/static/chunks/webpack.js net::ERR_FAILED
sign-up:1 
        
        
       GET http://localhost:3000/_next/static/chunks/react-refresh.js net::ERR_FAILED
4assert.ts:146 Uncaught (in promise) FirebaseError: Firebase: Error (auth/emulator-config-failed).
    at tn (assert.ts:146:55)
    at l (assert.ts:177:11)
    at nt (emulator.ts:50:3)
    at fc (auth-service-worker.js:94:2)
tn @ assert.ts:146
l @ assert.ts:177
nt @ emulator.ts:50
fc @ auth-service-worker.js:94
Show 3 more frames
Show less
sign-up:1 
        
        
       GET http://localhost:3000/_next/static/development/_buildManifest.js net::ERR_FAILED
sign-up:1 
        
        
       GET http://localhost:3000/_next/static/chunks/pages/_app.js net::ERR_FAILED
sign-up:1 
        
        
       GET http://localhost:3000/_next/static/chunks/pages/_error.js net::ERR_FAILED
sign-up:1 
        
        
       GET http://localhost:3000/_next/static/development/_ssgManifest.js net::ERR_FAILED
auth-service-worker.js:28 fetch for chrome-extension://aeblfdkhhhdcdjpifhhbdiojplfjncoa/inline/injected.js
auth-service-worker.js:28 fetch for http://localhost:3000/favicon.ico
auth-service-worker.js:89 config {apiKey: '...', authDomain: '...', projectId: '...', appId: '...'}
assert.ts:146 Uncaught (in promise) FirebaseError: Firebase: Error (auth/emulator-config-failed).
    at tn (assert.ts:146:55)
    at l (assert.ts:177:11)
    at nt (emulator.ts:50:3)
    at fc (auth-service-worker.js:94:2)
tn @ assert.ts:146
l @ assert.ts:177
nt @ emulator.ts:50
fc @ auth-service-worker.js:94
Show 3 more frames
Show less
:3000/favicon.ico:1