wits-for-test-3 v1.0.0
Wits
Wits is a development tool to help run your Tizen web application on your 2017+ Samsung TV during development.
It is the fastest way to get your local code running on device during development. Saving you from having to build, package, and reinstall your app each time you want to see how it will run on device. We call it a LIVE RELOAD
.
Wits is a help to continue your developing context.
System Requirements
Wits needs the following prerequisites on your local development machine.
Terminal
on MacOS / Linux orPowerShell
on WindowsYou must have Node.js (we recommend v7.10.1 for Wits) and Git installed on your system. We will not describe how to do these installations as there are many ways to do it and its developer preference. We recommend using something like
nvm
orasdf
to manage different versions of Node.js across your code projects.Install the Latest Version of Samsung Tizen Studio.
Wits requires the Tizen Studio CLI binaries added to your
$PATH
for access to thetizen
andsdb
command-line utilities.- For bash:
$ echo 'export PATH="$HOME/tizen-studio/tools/ide/bin:$PATH"' >> ~/.bash_profile $ echo 'export PATH="$HOME/tizen-studio/tools:$PATH"' >> ~/.bash_profile
- For Ubuntu Desktop:
$ echo 'export PATH="$HOME/tizen-studio/tools/ide/bin:$PATH"' >> ~/.bashrc $ echo 'export PATH="$HOME/tizen-studio/tools:$PATH"' >> ~/.bashrc
- For Zsh:
$ echo 'export PATH="$HOME/tizen-studio/tools/ide/bin:$PATH"' >> ~/.zshrc $ echo 'export PATH="$HOME/tizen-studio/tools:$PATH"' >> ~/.zshrc
- For Fish shell:
$ set -Ux fish_user_paths $HOME/tizen-studio/tools/ide/bin $fish_user_paths $ set -Ux fish_user_paths $HOME/tizen-studio/tools $fish_user_paths
- For bash:
Installing and Configuring Wits
Clone the Wits repository to your machine.
$ git clone https://github.com/Samsung/Wits.git
Install Wits Dependencies
$ cd ~/path-to/Wits $ npm install
Modify
profileInfo.json
within theWits
directory.Configure the Tizen Studio Certificate Profile Name and the path to your
profiles.xml
.You can modify and run the following command on
MacOS
to set this to the default.$ cd ~/path-to/Wits $ echo `{ "name": "my-certificate-profile", "path": "$HOME/tizen-studio-data/profile/profiles.xml" }` >> profileInfo.json
The default
path
onMacOS
should be/Users/my-mac-username/tizen-studio-data/profile/profiles.xml
and onWindows
C:/tizen-studio-data/profile/profiles.xml
.The
name
should be your pre-configured certificate profile name found in one of these locations:- Tizen Studio (Recommended)
Tools > Certificate Manager > Certificate Profile (Actived one)
- Tizen TV SDK 2.4 (legacy)
window > Preferences > Tizen SDK > Security Profiles
If your
profiles.xml
is not in one of the default locations, you may have it in the following legacy location.- Tizen TV SDK 2.4 (legacy)
/<yourWorkspace>/.metadata/.plugins/org.tizen.common.sign/profiles.xml
- Tizen Studio (Recommended)
Running Your App
Default user app path is www
. If you want use default path, place your html, js and css files for your project within the ~/path-to/Wits/www
directory. Otherwise, write your app directory path in the connectionInfo.json
file.
The contents of this directory will be copied to the TV that Wits is configured for.
Each time you make a change in your application path
, Wits will RELOAD your application on the TV instantly.
Configuring the Connection
You may change the directory that Wits uses to serve your app in the connectionInfo.json
file within the Wits directory.
You may configure Wits to listen to multiple paths for changes.
- on
Windows
andMacOS
, Wits recognize path segment only one separator(/
).
// connectionInfo.json
{
...
"baseAppPaths": [
"www",
"my-app",
"C:/YourProject/YourApp"
],
...
}
Configure Wits to Ignore Files
Sometimes there are files you do not want Wits to copy to your TV device such as your apps src
directory or node_modules
.
For this, add a .witsignore
to the base of your www
or code directory.
This works the same as .gitignore
.
Example of .witsignore
:
node_modules
.git
src
Launching Wits on your TV
To launch the Wits container on your Samsung TV you will need to ensure Developer Mode is enabled on the device.
Enabling Developer Mode on Samsung TV
- With your Samsung Remote, press the
Home
button. - Navigate to the
Apps
button and pressEnter/OK
. - When on the
Apps
screen, press1
2
3
4
5
in order on the remote to open theDeveloper Mode Dialog
. If this doesn't work, try it again. - When the Developer Mode Dialog appears, toggle the switch to
On
and enter the IP address of your development machine.
Start Wits from your Development Machine
You will need to know the IP address of the TV.
Get this from the Settings > General > Network Status
on your Samsung TV screen using the Samsung Remote.
Now, within the Wits project directory on your computer run npm start
to start it up and deploy it to your TV.
$ cd ~/path-to/Wits
$ npm start
You will be prompted to confirm each field in connectionInfo.json
before the app installs. Simply press Enter/Return
if the default is to be used.
The results when you're finished should look similar to the following:
? Input your Application Path : www
? Input your Application width (1920 or 1280) : 1920
? Input your TV Ip address(If using Emulator, input 0.0.0.0) : 10.8.83.8
? Input your port number : 8498
? Do you want to launch with chrome DevTools? : Yes
Debugging with Google Chrome DevTools
After running npm start
in the previous step, one of the prompts will ask Do you want to launch with chrome DevTools?
. Answer Yes
or press Enter
if default.
- A Google Chrome window should have opened after your app installs on the TV.
- Click the address link on the page.
- This opens a DevTools window.
- In console tab, change the value of Execution Context Selector
top
toContentHTML
.
The Wits Project Structure
./
|-tizen/ ................ Wits project
|-www/ .................. Your Tizen web Application
|-app.js ................ Node script for running Wits
|-connectionInfo.json ... Recently connected Information which has application width and TV Ip address.
|-package.json .......... npm package configuration
'-README.md ............. Introduce Wits file.
Supported Platforms
- 2017 Samsung Smart TV (Tizen 3.0)
- 2018 Samsung Smart TV (Tizen 4.0)
- 2019 Samsung Smart TV (Tizen 5.0)
4 years ago