Stack Overflow
Stack Overflow

Questions tagged [stencil-component]

82 questions
0
votes
1 answer

StencilJS: How to refresh UI when parent changes a property inside a Prop

We have a component made in StencilJS which has a Prop() that is being set by the parent that uses it and we want the UI to be updated every time the parent changes this Prop(), because depending on the value of this prop the UI will be…
Sergi Hurtado Abad
  • 9
  • 4
0
votes
1 answer

Why My Stencil count button doesn't refresh the page?

I'm new in Stencil.js, but I have experience with React. My first ejercise in Stencil doesn't work. I tried to make a simple count buttom. The result is that: enter image description here The var contador is NaN and the number 0 is always 0. Code…
Mr Usher
  • 21
  • 5
0
votes
1 answer

Stencil.js & RTK Query: Avoiding infinite callbacks

I am trying to decide if I am using RTKQuery to keep my Stencil.js components' state in sync with the DB correctly. The behaviour I have is that my component will fetch the data using RTK query and store.dispatch() and assign it to its local state.…
Che Coelho
  • 11
  • 2
0
votes
0 answers

Stencil.js: Unexpected URL behaviour - URL auto reloads to lowercase after a few milliseconds

I cannot understand why when my stencil.js app loads, it runs the componentWillLoad() lifecycle method twice, and just before the second one forces the url to lowercase. This is a problem as the url contains an encoded UID so when it is forced to…
Che Coelho
  • 11
  • 2
0
votes
0 answers

How to add global theme wrapper in stencil components?

I am using stencil.js to create a design system for react components. How can i add global theme utility that can make dark mode enable in every component ? I have no idea how can i do that.
Shrestha
  • 46
  • 4
0
votes
0 answers

StencilJS - Issue with nested child components and a checkbox not being updated

UPDATE: Solved by separating rendering into different functions and passing it the MenuItem: renderItem(item: TreeMenuItem) { console.log('render item:', item.label); return (
  • {item.children ?
    Victor
    • 1
    • 1
    • 0
    votes
    1 answer

    How to override stencil component template in Angular 2?

    I use the https://github.com/telekom/scale components library (not writing my own library). All components there were built using Stencil and they can be used without problems. However, I need to change a Stencil component html a bit and add an…
    Orachigami
    • 416
    • 3
    • 4
    0
    votes
    0 answers

    Stencil keydown event listener is not working when it is in an NPM package

    I am using Stencil2+ in my application. I have one query related to the keydown event of Stencil. When I use the keydown event directly from the component, the listener is able to react to the event. But when I am using my component inside another…
    Priya
    • 66
    • 1
    • 8
    0
    votes
    0 answers

    Combine/re-use Stencil Decorators

    For some while now I am trying to figure out how to re-use Stencil Decorators. In our company we have a whole bunch of components that do all use Translations. A user of our web component should be able to pass a translations object as an attribute.…
    Jeroen De Groote
    • 78
    • 5
    0
    votes
    1 answer

    Stenciljs having troubles testing emitted event with Jest

    I'm writing an input component using stencil and I'm having troubles testing the emitted event which is fired on a click or enter key press.The component: export class Input { . . private inputRef?: HTMLInputElement; @Event()…
    Alex
    • 1,982
    • 4
    • 37
    • 70
    0
    votes
    2 answers

    How to separate template out of stencil components (lazy load template)

    Interesting problem, so please read till the end. what I want to achieve is separating template in another js file and lazyload it when required. This same thing when done in React ecosystem works, but stencil doesn't! Triage Repo…
    minigeek
    • 2,766
    • 1
    • 25
    • 35
    0
    votes
    1 answer

    Component second time render hides the input focus of first component in stencilJS

    I am trying to learn stencilJS, I am developing the component which has input field with auto focus. I am calling component twice in index.html, I am getting into strange issue the second render component is taking autofocus of first render…
    MogerCS
    • 342
    • 1
    • 5
    • 16
    0
    votes
    2 answers

    Stencil unit testing: How to mock initial state and load newSpecPage?

    I am new to unit testing and planning to write unit test cases but not E-2-E for the below mentioned scenario and playgrounnd link for scenario is at the bottom. Scenario:- I have a @State variable called "ifSuccessResponse" with initial value set…
    raj
    • 1
    • 2
    0
    votes
    1 answer

    function with return statement moved to index.d.ts throws build Error TS1036 ... _worked perfectly in a regular TS file before_

    Node v14.x, StencilJS (React) v2.3.x I had a test-helper file with an exported function that converts string-arrays to number-arrays: export function parseNumericStringOrStringArrayToIntegers(value: string | (string | string[])[]): number | (number…
    sneeuwitje
    • 131
    • 1
    • 1
    • 6
    0
    votes
    1 answer

    How to use bigcommerce stencil component to handlebar JS?

    Handlebar template: