signalwire · jpsantosbh · Jun 12, 2025 · Mar 8, 2025 · Mar 11, 2025 · Mar 11, 2025
diff --git a/.changeset/cute-zebras-grin.md b/.changeset/cute-zebras-grin.md
@@ -0,0 +1,10 @@
+---
+'@signalwire/webrtc': minor
+'@signalwire/js': minor
+---
+
+Added dial params:
+
+- audioCodecs
+
+The new parameter allows developers to select the audio codec to use with the desired configuration
diff --git a/internal/e2e-js/tests/roomSessionStreamingAPI.spec.ts b/internal/e2e-js/tests/roomSessionStreamingAPI.spec.ts
@@ -52,7 +52,6 @@ test.describe('Room Streaming from REST API', () => {
     const STREAM_CHECK_URL = process.env.STREAM_CHECK_URL!
     await pageTwo.goto(STREAM_CHECK_URL, { waitUntil: 'domcontentloaded' })
     await pageTwo.waitForSelector(`text=${streamName}`, { timeout: 10_000 })
-
     await deleteRoom(roomData.id)
   })
 })
diff --git a/internal/playground-js/src/fabric/index.html b/internal/playground-js/src/fabric/index.html
@@ -26,6 +26,7 @@
       href="https://signalwire.com/assets/images/favicon.ico"
     />
   </head>
+
   <body class="bg-light">
     <div class="container">
       <div class="row pt-5">
@@ -104,7 +105,23 @@ <h5>Connect</h5>
                   </label>
                 </div>
               </div>
-              <div class="d-grid gap-2">
+              <div class="card">
+                <div class="card-body">
+                  <div class="form-group">
+                    <label for="targetCodec">Audio Codec Override</label>
+                    <textarea
+                      type="text"
+                      rows="3"
+                      class="form-control"
+                      id=""
+                      placeholder="opus:maxplaybackrate=8000;maxaveragebitrate=4000\nPCMU:"
+                      onchange="saveInLocalStorage(event)"
+                    ></textarea>
+                  </div>
+                </div>
+              </div>
+
+              <div class="d-grid gap-2 mt-3">
                 <button
                   id="btnConnect"
                   class="btn btn-primary"

diff --git a/internal/playground-js/src/fabric/index.js b/internal/playground-js/src/fabric/index.js
@@ -307,14 +307,20 @@ window.dial = async ({ reattach = false } = {}) => {
 
   const dialer = reattach ? client.reattach : client.dial
 
-  const call = await dialer({
+  const dialOptions = {
     nodeId: steeringId,
     to: document.getElementById('destination').value,
     rootElement: document.getElementById('rootElement'),
     fromFabricAddressId: document.getElementById('fromFabricAddressId').value,
     video: document.getElementById('video').checked,
     audio: document.getElementById('audio').checked,
-  })
+  }
+
+  if (document.getElementById('audioCodec').value.trim().length) {
+    const userInput = document.getElementById('audioCodec').value.trim()
+    dialOptions.audioCodecs = userInput.split('\n').map((codec) => codec.trim())
+  }
+  const call = await dialer(dialOptions)
 
   window.__call = call
   roomObj = call
@@ -910,6 +916,12 @@ window.ready(async function () {
   document.getElementById('audio').checked = true
   document.getElementById('video').checked =
     localStorage.getItem('fabric.ws.video') === 'true'
+  document.getElementById('targetCodec').value =
+    localStorage.getItem('fabric.ws.targetCodec') || ''
+  document.getElementById('maxPlaybackRate').value =
+    localStorage.getItem('fabric.ws.maxPlaybackRate') || ''
+  document.getElementById('maxAverageBitrate').value =
+    localStorage.getItem('fabric.ws.maxAverageBitrate') || ''
 
   const urlParams = new URLSearchParams(window.location.search)
   const room = urlParams.get('room')

diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/core/src/types/utils.ts b/packages/core/src/types/utils.ts
@@ -147,3 +147,11 @@ export type Promisify<T> = {
 export type Prettify<T> = NonNullable<unknown> & {
   [K in keyof T]: Prettify<T[K]>
 } & {}
+
+export type AudioCodecOptions =
+  | `opus:${string}`
+  | `red:${string}`
+  | `G722:${string}`
+  | `PCMU:${string}`
+  | `PCMA:${string}`
+  | `telephone-event:${string}`
diff --git a/packages/js/src/fabric/WSClient.ts b/packages/js/src/fabric/WSClient.ts
@@ -195,6 +195,7 @@ export class WSClient extends BaseClient<{}> implements WSClientContract {
       disableUdpIceServers: params.disableUdpIceServers || false,
       userVariables: params.userVariables || this.wsClientOptions.userVariables,
       fromFabricAddressId: params.fromFabricAddressId,
+      audioCodecs: params.audioCodecs,
     })
 
     // WebRTC connection left the room.
@@ -232,6 +233,7 @@ export class WSClient extends BaseClient<{}> implements WSClientContract {
       prevCallId: payload.callID,
       disableUdpIceServers: params.disableUdpIceServers || false,
       userVariables: params.userVariables || this.wsClientOptions.userVariables,
+      audioCodecs: params.audioCodecs
     })
 
     // WebRTC connection left the room.

diff --git a/packages/js/src/fabric/interfaces/wsClient.ts b/packages/js/src/fabric/interfaces/wsClient.ts
@@ -1,4 +1,8 @@
-import { SessionOptions, UserOptions } from '@signalwire/core'
+import {
+  AudioCodecOptions,
+  SessionOptions,
+  UserOptions,
+} from '@signalwire/core'
 import {
   IncomingCallHandler,
   IncomingCallHandlers,
@@ -117,6 +121,8 @@ export interface CallParams extends DefaultCallParams {
   stopMicrophoneWhileMuted?: boolean
   /** Fabric address ID matching one of the subscriber’s addresses to attribute conversation API events in the INVITE. */
   fromFabricAddressId?: string
+  /** Audio codec with fmtp params */
+  audioCodecs?: AudioCodecOptions[]
 }
 
 export interface DialParams extends CallParams {

diff --git a/packages/webrtc/package.json b/packages/webrtc/package.json
@@ -38,7 +38,10 @@
   },
   "dependencies": {
     "@signalwire/core": "4.3.0-dev.202506111650.ad2f5be.0",
-    "sdp": "^3.2.0"
+    "sdp-transform": "2.15.0"
   },
-  "types": "dist/cjs/webrtc/src/index.d.ts"
+  "types": "dist/cjs/webrtc/src/index.d.ts",
+  "devDependencies": {
+    "@types/sdp-transform": "^2.4.9"
+  }
 }
diff --git a/packages/webrtc/src/RTCPeer.ts b/packages/webrtc/src/RTCPeer.ts
@@ -5,10 +5,11 @@ import {
   filterIceServers,
 } from './utils/helpers'
 import {
-  sdpStereoHack,
   sdpBitrateHack,
   sdpMediaOrderHack,
   sdpHasValidCandidates,
+  useAudioCodecs,
+  sdpStereoHack,
 } from './utils/sdpHelpers'
 import { BaseConnection } from './BaseConnection'
 import {
@@ -71,6 +72,8 @@ export default class RTCPeer<EventTypes extends EventEmitter.ValidEventTypes> {
       this.options
     )
 
+    this._validateOptions()
+
     this._onIce = this._onIce.bind(this)
     this._onEndedTrackHandler = this._onEndedTrackHandler.bind(this)
 
@@ -86,6 +89,16 @@ export default class RTCPeer<EventTypes extends EventEmitter.ValidEventTypes> {
     this.rtcConfigPolyfill = this.config
   }
 
+  private _validateOptions() {
+    if (
+      this.options.useStereo === true &&
+      typeof this.options.audio === 'object' &&
+      (this.options.audio.channelCount ?? 2) !== 2
+    ) {
+      throw new Error('Mismatch params: useStereo, audio.channelCount')
+    }
+  }
+
   get options() {
     return this.call.options
   }
@@ -820,6 +833,7 @@ export default class RTCPeer<EventTypes extends EventEmitter.ValidEventTypes> {
       googleMaxBitrate,
       googleMinBitrate,
       googleStartBitrate,
+      audioCodecs,
     } = this.options
     if (localDescription.sdp && useStereo) {
       localDescription.sdp = sdpStereoHack(localDescription.sdp)
@@ -837,17 +851,15 @@ export default class RTCPeer<EventTypes extends EventEmitter.ValidEventTypes> {
         googleStartBitrate
       )
     }
-    // this.logger.debug(
-    //   'LOCAL SDP \n',
-    //   `Type: ${localDescription.type}`,
-    //   '\n\n',
-    //   localDescription.sdp
-    // )
+    if (localDescription.sdp && audioCodecs) {
+      localDescription.sdp = useAudioCodecs(localDescription.sdp, audioCodecs)
+    }
     return this.instance.setLocalDescription(localDescription)
   }
 
   private _setRemoteDescription(remoteDescription: RTCSessionDescriptionInit) {
-    if (remoteDescription.sdp && this.options.useStereo) {
+    const { useStereo } = this.options
+    if (remoteDescription.sdp && useStereo) {
       remoteDescription.sdp = sdpStereoHack(remoteDescription.sdp)
     }
     if (remoteDescription.sdp && this.instance.localDescription) {