Trying to use input device api

[Peter-Barrett]

The Tizen API seems to be failing to load in our application.

I have the following import import { tvinputdevice } from 'tizen-common-web';

but I am getting this error: Cannot destructure property 'AlarmAbsolute' of 'window.tizen' as it is undefined

I know this is pretty light on details so let me know what other information you need and I will get it for you.

[Peter-Barrett]

@SejoongDeJang do you have any ideas on this?

[SejoongDeJang]

@Peter-Barrett Sorry to late. I'd like to check your package list. Can you share your package.json?

[Peter-Barrett]

No problem, thanks for getting back to me. Here is my package.json:

{
  "name": "samsung-tv-web-app",
  "version": "1.2.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "test:e2e": "vue-cli-service test:e2e",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@sentry/tracing": "^6.7.1",
    "@sentry/vue": "^6.7.1",
    "@types/lodash": "^4.14.155",
    "@types/node": "^14.0.5",
    "aws-amplify": "^3.3.14",
    "core-js": "^3.6.4",
    "lodash": "^4.17.19",
    "smoothscroll-polyfill": "^0.4.4",
    "tizen-common-web": "^2.0.1",
    "vanilla-lazyload": "^17.1.0",
    "video.js": "7.12.0",
    "vue": "^2.6.11",
    "vue-class-component": "^7.2.3",
    "vue-concise-slider": "^3.4.4",
    "vue-i18n": "^8.17.7",
    "vue-material-design-icons": "^4.9.0",
    "vue-moment": "^4.1.0",
    "vue-property-decorator": "^8.4.1",
    "vue-router": "^3.1.6",
    "vue-spatialnavigation": "^1.2.1",
    "vuex": "^3.1.3",
    "whatwg-fetch": "^3.0.0"
  },
  "devDependencies": {
    "@typescript-eslint/eslint-plugin": "^2.26.0",
    "@typescript-eslint/parser": "^2.26.0",
    "@vue/cli-plugin-babel": "~4.3.0",
    "@vue/cli-plugin-e2e-cypress": "~4.3.0",
    "@vue/cli-plugin-eslint": "~4.3.0",
    "@vue/cli-plugin-router": "~4.3.0",
    "@vue/cli-plugin-typescript": "~4.3.0",
    "@vue/cli-plugin-vuex": "~4.3.0",
    "@vue/cli-service": "~4.3.0",
    "@vue/eslint-config-typescript": "^5.0.2",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "node-sass": "^4.12.0",
    "sass-loader": "^8.0.2",
    "typescript": "~3.8.3",
    "vue-plugin-load-script": "^1.2.0",
    "vue-template-compiler": "^2.6.11"
  }
}

[SejoongDeJang]

Well... the package is installed correctly.

The commonjs is not work on a Tizen Web App. You need to compile a commonjs to vanilla js. Here is our sample app with commonjs style with a webpack. Please check a webpack.config.js. https://github.com/Samsung/tizen-common-web/tree/master/samples/commonjs

If you are enable running a web inspector, can you test run followed code in the inspector?

/* Sets an alarm on January 1st 2014 08:00. */
var date = new Date(2014, 0, 1, 8, 0);
var alarm1 = new tizen.AlarmAbsolute(date);
tizen.alarm.add(alarm1);

In my test app, I got VM124:1 Uncaught WebAPIException {code: 18, name: 'SecurityError', message: 'Permission denied', stack: 'SecurityError: Permission denied\n at NativeMana….add (<anonymous>:1:2718)\n at <anonymous>:4:13'} error because of my test app doesn't have a privilege.

I'm not well known about a vue framework. But there is a @types/node package. I just wonder your package contain both server side and client side. And then, did your client launched on a device(emulator or real device)?

[pwsses]

Hello @Peter-Barrett Did you tested on Tizen tv device right? I think, as your error message, your environment might looks like not be tizen tv device. Cannot destructure property 'AlarmAbsolute' of 'window.tizen' as it is undefined

[Peter-Barrett]

@SejoongDeJang thanks, I won't be able to test it today but I will try during the week and let you know what I find out.

@pwsses I'm using the simulator.