Challenge tabs

Configure different tab types in challenges.

Overview

Tabs are how learners interact with your product and a track's sandbox. You can have the following tab types:

Web based applications
Your applications
Code editor
Terminal
Virtual Browser

Web based applications

Web based applications are the simplest tab type - all they do is point to a website.

If your website is not displaying, it is likely blocking iframes. Use a site like https://iframetester.com to check compatibility. Try turning on the optional setting to open the link in a new tab, or use the Virtual browser.

Field Description Type Required

Field	Description	Type	Required
Tab name	This property sets the tab title. And each service has its own tab.	`string`	Required
Website link	The URL of the website opened in this browser. Must be a https:// address. Self-signed SSL certificates are OK. If you use `${_SANDBOX_ID}` in a URL, it will be replaced with the sandbox ID.	`string`	Required
Open website in a new window	Whether to open the tab in a new window. Useful for when the service doesn't allow being run in an iframe.	`boolean`	Optional

Tab name

This property sets the tab title. And each service has its own tab.

string

Required

Website link

The URL of the website opened in this browser. Must be a https:// address. Self-signed SSL certificates are OK. If you use ${_SANDBOX_ID} in a URL, it will be replaced with the sandbox ID.

string

Required

Open website in a new window

Whether to open the tab in a new window. Useful for when the service doesn't allow being run in an iframe.

boolean

Optional

tabs:
- title: <tab_title>
  type: website
  url: <website_url>
  new_window: <true/false>

Your applications

Your applications are tabs that point to web services running inside a sandbox.

For example, if you select a host but don't specify a path, the application will display the service hosted at https://[HOSTNAME]-[PORT]-[PARTICIPANT_ID].env.play.instruqt.comwith the specified port number. You can think of this as https://localhost:port, but the concept of localhost doesn't exist within the Instruqt platform. For more details on networking within Instruqt, view the networking overview page.

Field Description Type Required

Field	Description	Type	Required
Tab name	This property sets the tab title. And each service has its own tab.	`string`	Required
Select your host	This property sets the tab hostname.	`string`	Required
Path	The filesystem path on the host that should be used in the editor. For example, if you specify the path to be /example then the web service shown in the tab will be `https://[HOSTNAME]-[PORT]-[PARTICIPANT_ID].env.play.instruqt.com/example`	`string`	Optional
Port	The port that is used to connect to the service running on the host. If the sandbox host is a container, the port must be exposed in the containers host settings.	`string`	Required

Tab name

This property sets the tab title. And each service has its own tab.

string

Required

Select your host

This property sets the tab hostname.

string

Required

Path

The filesystem path on the host that should be used in the editor. For example, if you specify the path to be /example then the web service shown in the tab will be https://[HOSTNAME]-[PORT]-[PARTICIPANT_ID].env.play.instruqt.com/example

string

Optional

Port

The port that is used to connect to the service running on the host. If the sandbox host is a container, the port must be exposed in the containers host settings.

string

Required

tabs:
- title: <tab_title>
  type: service
  hostname: <hostname>
  path: <path>
  port: <port> 
  new_window: <true/false>

If your service uses HTTPS, its port must end in 443, for example, 8443.

Code editor

Code editor tabs open a simple code editor to a specified path on a host.

Field Description Type Required

Field	Description	Type	Required
Tab name	This property sets the tab title. And each service has its own tab.	`string`	Required
Select your host	This property sets the tab hostname.	`string`	Required
Path	The filesystem path on the host that should be used in the editor. For example, in Linux start with /root/	`string`	Optional

Tab name

This property sets the tab title. And each service has its own tab.

string

Required

Select your host

This property sets the tab hostname.

string

Required

Path

The filesystem path on the host that should be used in the editor. For example, in Linux start with /root/

string

Optional

tabs:
- title: <tab_title>
  type: code
  hostname: <hostname>
  path: <path> # optional

Terminal

Terminal tabs open a terminal on a specified host.

Field Description Type Required

Field	Description	Type	Required
Tab name	This property sets the tab title. And each service has its own tab.	`string`	Required
Select your host	This property sets the tab hostname.	`string`	Required
Working directory	This property sets the working directory of the terminal. It defaults to `$HOME`.	`string`	Optional
Custom commands	This property sets a command to run upon opening the terminal. Further commands cannot be run.	`string`	Optional

Tab name

This property sets the tab title. And each service has its own tab.

string

Required

Select your host

This property sets the tab hostname.

string

Required

Working directory

This property sets the working directory of the terminal. It defaults to $HOME.

string

Optional

Custom commands

This property sets a command to run upon opening the terminal. Further commands cannot be run.

string

Optional

tabs:
- title: <tab_title>
  type: terminal
  hostname: <hostname>
  workdir: <working_directory> # optional
  cmd: <command_to_run> # optional

Virtual browser

Virtual browser tabs display the URL of a Website service host.

Field Description Type Required

Field	Description	Type	Required
Tab name	This property sets the tab title.	`string`	Required
Select your host	This property sets which website service host the tab displays.	`string`	Required

Tab name

This property sets the tab title.

string

Required

Select your host

This property sets which website service host the tab displays.

string

Required

tabs:
- title: <tab_title>
  type: browser
  hostname: <hostname>

Virtual browser tabs only become available once a website service host is created.

PreviousCreate challenges NextChallenge order

Last updated 26 days ago