> ## Documentation Index > Fetch the complete documentation index at: https://docs.xbox.com/llms.txt > Use this file to discover all available pages before exploring further. # Web Content Test Application (CTA) on xbox.com/play > Describes how to use the web Content Test Application developer tools on xbox.com/play. The Web Content Test Application (CTA) developer tools are available at [xbox.com/play](https://www.xbox.com/play), the current XBOX Cloud Gaming web experience. These tools are designed for Edge and Chrome on Windows, and for Safari on Mac, iOS, and iPadOS. This article covers xbox.com/play. A new experience is in preview at [play.xbox.com](https://play.xbox.com/). To use its developer tools, see [Web Content Test Application (CTA) overview](https://docs.xbox.com/build/core-features/common/game-streaming/game-streaming-web-content-test-application.md). * [Choose an experience](#choose-an-experience) * [Open developer tools](#open-developer-tools) * [Select an offering](#select-an-offering) * [IP Connect](#ip-connect) * [Remote Connect](#remote-connect) * [Developer settings](#developer-settings) * [TAK sideload](#tak-sideload) * [Switch TAK layouts during a stream](#switch-tak-layouts-during-a-stream) * [Mouse and Keyboard](#mouse-and-keyboard) * [Try the new experience](#try-the-new-experience) ## Choose an experience The web CTA runs on two XBOX Cloud Gaming web experiences: xbox.com/play and play.xbox.com, which is in preview. Use this table to choose one for your scenario: | Scenario | xbox.com/play | play.xbox.com | | :- | :- | :- | | IP Connect to an XBOX Development Kit | Supported with a sandbox test account only | Supported | | TAK sideload from the same PC | Supported | Supported | | TAK sideload to a phone or tablet from a PC | Supported over HTTPS | Not supported yet | | Switch layouts during a stream | Supported | Supported | | Remote Connect | Supported | Supported | Both experiences support private offerings, sandbox test accounts, region selection, and Mouse and Keyboard. ## Open developer tools To start using the developer tools, go to [xbox.com/play/dev-tools](https://www.xbox.com/play/dev-tools). If you aren't signed in, the page asks you to sign in and includes a sandbox field. * For retail accounts, leave the sandbox blank and sign in with the same account that's signed in to the XBOX Development Kit or configured to access a private offering. * For sandbox test accounts, enter the sandbox ID before you sign in. A sandbox is an isolated development environment for your title, and each sandbox test account belongs to one. The sandbox ID isn't your offering ID; get it from whoever created your test accounts. For more information, see [XBOX services sandboxes overview](https://docs.xbox.com/services/xbox-services/fundamentals/sandboxes/live-setup-sandbox.md). > [!NOTE] > > If you sign in to a sandbox test account without its sandbox ID, some features might not work, because these accounts don't have access to retail features. If you signed in without the sandbox ID, sign out by visiting another Microsoft website, such as [outlook.com](https://www.outlook.com). Then sign in again with the correct sandbox ID. You can also open developer settings from the xbox.com/play catalog. Select your profile picture, then select **Settings** > **Developer**. If **Developer** isn't shown, select **Account** 10 times in quick succession to reveal it. In developer settings, **Developer Tools Home** returns to the developer tools page. > [!NOTE] > > On iOS or iPadOS, you can save the page as a progressive web app (PWA). Select the share button, then select **Add to Home Screen**. > > The PWA remembers your account and configuration, so you can return to testing later. ## Select an offering Offerings are the private test environments used to validate games running on datacenter hardware. For more information on offerings, see [Game Streaming Overview](https://docs.xbox.com/build/core-features/common/game-streaming/game-streaming-overview.md#what-are-private-offerings). To use a specific offering: 1. Go to [xbox.com/play/dev-tools/select-offering](https://www.xbox.com/play/dev-tools/select-offering). 2. Select the offering from the dropdown list, or select **Custom offering ID** and enter the offering ID in **Enter offering ID for cloud connection**. 3. Select **Connect**. The catalog for your offering opens, and the page shows **Using custom offering** followed by the offering ID. If you're unable to access the offering, make sure you're signed in to an account that's authorized to use that specific offering. ### Offering regions Offerings don't automatically route you to the closest datacenter. To test in a different region, open **Settings** > **Developer** and choose a region under **Streaming Region**. Choose it before you start a stream. **Current region** shows your selection. Available regions must be configured ahead of time. Contact your Microsoft account representative to adjust the available regions for your offering. ## IP Connect Use IP Connect to stream directly from an XBOX Development Kit by IP address. On xbox.com/play, IP Connect requires a sandbox test account, and the developer tools page doesn't link to it. Before using IP Connect, complete these prerequisites: 1. Set up your XBOX Development Kit for streaming. For more information, see [Set up an XBOX Development Kit](https://docs.xbox.com/build/core-features/common/game-streaming/game-streaming-setup-xbox-developer-kit.md). 2. In **Dev Home** > **Streaming**, make sure **Direct Connect** is listening. It stops listening each time the kit restarts. 3. Make sure your client device is on the same network as your XBOX Development Kit, or connected through a VPN. 4. Make sure your network allows TCP and UDP traffic to port 9002 on the XBOX Development Kit. The browser uses a WebSocket connection for signaling and UDP for the stream. To connect by IP address: 1. Go to [xbox.com/play/dev-tools](https://www.xbox.com/play/dev-tools). Enter the sandbox ID, then sign in with a test account for that sandbox. 2. Go to [xbox.com/play/dev-tools/ip-connect](https://www.xbox.com/play/dev-tools/ip-connect). 3. Enter the IP address and port of the XBOX Development Kit, for example `192.168.1.10:9002`. 4. Select **Connect**. 5. If your browser asks for permission to access devices on your local network, select **Allow**. When the connection succeeds, the app running on the XBOX Development Kit appears in the browser. If you're signed in with a retail account, the IP Connect address returns you to the developer tools page. ## Remote Connect Remote Connect streams from your XBOX Development Kit over the internet through XBOX remote play services. It finds the kit through your signed-in account, so you don't enter an IP address. First, set up the XBOX Development Kit: 1. Sign in to the XBOX Development Kit with the account you'll use on xbox.com/play. The account must be allowed in the kit's sandbox. 2. Go to **Dev Home** > **Streaming**. Under **Remote Connect**, select your account. 3. In **Dev Home** > **Streaming**, make sure **Direct Connect** isn't listening. Direct Connect is a separate connection mode for IP Connect, and it blocks Remote Connect while it's listening. Then connect from xbox.com/play: 1. Go to [xbox.com/play/dev-tools](https://www.xbox.com/play/dev-tools) and sign in with the same account. For a sandbox test account, enter the sandbox ID before you sign in. 2. Select **Remote Connect**. It's available when your signed-in account has a development kit set up for Remote Connect, or when you're signed in with a sandbox test account. 3. Find your XBOX Development Kit in the list, then select **Connect**. > [!NOTE] > > Both the XBOX Development Kit and the device you're connecting from need an internet connection. > > Unlike IP Connect, Remote Connect doesn't require the two devices to be on the same network. ## Developer settings To open developer settings, select your profile picture, then select **Settings** > **Developer**. Developer settings include the current offering and stream configuration settings. [Stream Configuration Overview](https://docs.xbox.com/build/core-features/common/game-streaming/game-streaming-content-test-application-stream-config.md) includes more information about the specific stream configuration settings that can be overridden. Under **Stream Configuration** > **Touch adaptation**, you can set: * **Enable sideload**: Loads touch layouts from the [TAK CLI](https://docs.xbox.com/build/core-features/common/game-streaming/tak-command-line-tool/game-streaming-tak-command-line.md) `serve` command instead of the layouts published for your title. * **Sideload server address**: The address of the sideload server. * **Enable automatic refresh**: Updates the layouts on your device when you change them on the sideload server. * **Emulate touch with mouse**: Treats mouse clicks as touch. ## TAK sideload These steps cover streaming from a custom offering or an XBOX Development Kit. To use an offering, see [Select an offering](#select-an-offering). Before you start, run [`tak serve`](https://docs.xbox.com/build/core-features/common/game-streaming/tak-command-line-tool/game-streaming-tak-command-line-serve-command) on the PC that serves your layouts. To sideload from the same PC as the browser: 1. Open **Settings** > **Developer** and find **Touch adaptation**. 2. Turn on **Enable sideload**. 3. In **Sideload server address**, enter the address of your sideload server, for example `http://localhost:9269`. Any address other than `localhost` must use `https`, as described in [Sideload from another device](#sideload-from-another-device). 4. Under **Network Status**, check **Network Permission**. If it shows **Required**, select **Request Permission**. When the browser asks to let the site **Access other apps and services on this device**, select **Allow**. 5. On a PC without a touch screen, turn on **Emulate touch with mouse**. Without it, the stream shows no touch controls and the **TAK** menu isn't available. 6. When **Server Connection** shows **Connected**, start a stream. If it shows **Not Reachable**, make sure `tak serve` is running, then select **Recheck**. Changing **Enable sideload** or **Emulate touch with mouse** during a stream prompts you to switch games. To confirm that the stream uses your layouts, check for them under **Bundle layouts**, as described in [Switch TAK layouts during a stream](#switch-tak-layouts-during-a-stream). ### Sideload from another device To test on a phone or tablet, run `tak serve` on a PC that the device can reach on your local network. The server must use `https`: 1. Create a certificate. For more information, see [Certificate Generation Instructions](https://docs.xbox.com/build/core-features/common/game-streaming/tak-command-line-tool/game-streaming-tak-command-line-serve-command.md#certificate-generation-instructions). 2. On the PC, run `tak serve` with the `--certificate-file` and `--certificate-password` options. 3. Install the certificate on the phone or tablet and trust it. For steps, see [Trusting the certificate on different clients](https://docs.xbox.com/build/core-features/common/game-streaming/tak-command-line-tool/game-streaming-tak-command-line-serve-command.md#trusting-the-certificate-on-different-clients). 4. On the phone or tablet, open **Settings** > **Developer**, turn on **Enable sideload**, and enter `https://:9269` in **Sideload server address**. 5. Check **Network Permission** and **Server Connection**, as described in steps 4 and 6 of [TAK sideload](#tak-sideload). To require a password, use the `--password` option and enter the same password in the device's developer settings. For more information, see [Serve Command](https://docs.xbox.com/build/core-features/common/game-streaming/tak-command-line-tool/game-streaming-tak-command-line-serve-command.md). ## Switch TAK layouts during a stream In developer mode, you can switch the active layout while streaming: 1. In the stream, open **Developer Tools Menu** in the bottom-left corner, then select **TAK**. 2. Under **Select touch controls layout**, select a layout under **Bundle layouts** or **System layouts**. **Bundle layouts** shows the layouts loaded for this stream. When sideload works, those are your layouts. 3. Select **Close**. The **System layouts** are **Standard** and **Native Touch Only (Blank)**. **Standard** shows the standard controller overlay. **Native Touch Only (Blank)** removes the touch controls. ## Mouse and Keyboard Before you start, open developer tools as described in [Open developer tools](#open-developer-tools). 1. In **Settings** > **Developer**, under **Stream Configuration** > **Enabled input types**, turn on **Mouse and keyboard**. Change this setting before you start a stream. 2. Under **Touch adaptation**, turn off **Emulate touch with mouse**. When both are on, mouse clicks are treated as touches. 3. Start a stream. 4. If a banner reads **Enter fullscreen mode to play with mouse and keyboard**, select **Enter fullscreen**. To release the mouse, press the key shown in the **Press *key* to release your mouse** notification. ## Try the new experience To switch to the new experience at play.xbox.com, select your profile picture, then select **Try the new experience** > **Try now**. To return to xbox.com/play, open **Account settings** from your profile and select **Exit preview**. ## Related topics - [Web Content Test Application (CTA) overview](https://docs.xbox.com/build/core-features/common/game-streaming/game-streaming-web-content-test-application.md) - [Additional standalone tools](https://docs.xbox.com/tools/additional-tools.md) - [Content Test Application (CTA) Stream Configuration](https://docs.xbox.com/build/core-features/common/game-streaming/game-streaming-content-test-application-stream-config.md) - [Deploying touch control layouts using TAK CLI](https://docs.xbox.com/build/core-features/common/game-streaming/building-touch-layouts/game-streaming-touch-deploying-touch-layout.md) - [Android Content Test Application (CTA) overview (Deprecated)](https://docs.xbox.com/build/core-features/common/game-streaming/game-streaming-android-content-test-application.md)