Using webOS TV Extension

This article guides you on developing apps using the webOS TV extension for Visual Studio (VS) Code. After completing VS Code configuration, read this guide to develop webOS TV apps in VS Code.

The following sections provide:

Creating Web App

To create a web app in VS Code, generate a project first, then write your code. After writing your code, you can package your project into an app. 

Generating a Project with a Template

Start by creating a web app using one of the available templates. These templates provide a starting point for developing web apps.

  1. Select webOS TV: Generate Project from the Command Palette (Ctrl+Shift+P).

  2. Select Basic Web App.

  3. Select a location for your app with the file system button at the right-upper corner of the command palette.
    You can press Enter to create a basic web app in the default path (your current workspace directory).

  4. Enter the project name of your app.

  5. Enter your app properties - app ID, app version, and app title.
    You can press Enter to set it as default values.

  6. Select whether to open the created app directory as the workspace.

The following example image shows the my_web_app project under the MY_PROJECT folder with the basic web app template. It did not open the my_web_app project as the workspace by selecting "No" in the last step.

Screenshot shown the generated project with a template on VS Code

Packaging the Project into an App

Follow the steps to package your web app created in the previous section into an IPK app file.

  1. Select webOS TV: Package Application from the Command Palette (Ctrl+Shift+P).

  2. Enter the directory of your web app.
    You can press Enter to set it as the default path (your current workspace directory).

  3. Enter the directory path to locate the packaged app file.
    You can press Enter to set it as the default path (your current workspace directory).

  4. Select whether to minify your app.
    To debug with the web inspector, select "No."

If your app is packaged successfully, the IPK file is created as below.

Screenshot shown the packaged app in the Explorer

Deploying Web App

Before you deploy your web app on the target device, make sure to connect the target device to your PC. For more information about the connection, see the Connecting Target Device section.

Installing the App

Install the packaged app on the target device.

  1. Right-click the IPK file from the Explorer.

  2. Select the device to install the app.

If your app is installed on the target device successfully, you can see the app on the webOS TV Devices view below.

Screenshot shown the installed app on the webOS TV device view

You can also install your app with the webOS TV: Install Application command on the Command Palette or the Device Context menu. 

Launching the App

Launch the app installed on the target device.

  1. Right-click your app ID to launch from the installed apps list.

  2. Select 'Run.'

Screenshot shown the 'Run' menu to launch the app

You can also launch your app with the webOS TV: Launch Application command on the Command Palette.

Debugging Web App

Before debugging your app, make sure to set the value of webostv.choromExecutable property in Settings. For more information about the setting, see the Setting webOS TV Extension section.

Inspecting the App

Run Web Inspector and open the browser. Web Inspector displays the running information about your app.

  1. Right-click the app ID to debug from the installed or running apps list.

  2. Select 'Debug.'

  3. Chrome browser for Web Inspector is launched with the debugging URL.

Screenshot shown the 'Debug' menu to inspect the app

You can also launch your app with the webOS TV: Inspect Application command on the Command Palette.

Running the App without Installation

You can run your app on the target device without packaging and installing it whenever you change the code.

Screenshot shown the 'Run without Installation' menu

  1. Right-click the app directory to select the 'Run without Installation' menu from the explorer.

  2. Select the target device to run the app.

  3. Enter the IP address of the host PC (your local PC).

 

Navigation