Property error but resolves the value?

[Pablo_Gustavo_Fiscel (Pablo Gustavo Fiscella)]

Hi all. Does anyone know what the error is? When I show the value that the console.log returns it says 7 but after that it says that it cannot read the attributes property. I do not understand what is happening. Why does it display the value 7 if it can’t read the attributes property? Thanks

This only happens when there are no active conditional cards. If there is one running there is no error

7
button-card.js:425 ButtonCardJSTemplateError: TypeError: Cannot read properties of undefined (reading 'attributes') in 'console.log(states['input_select.players_home'].attributes.options.length);
  let cantMedias = sta...'
    at Je.eval (eval at _evalTemplate (button-card.js:425:9295), <anonymous>:16:24)

  players_home:
    initial: Ultima descarga
    options:
      - Ultima descarga
      - Dormitorio_Ana
      - Chromecast 2
      - bdv_n9200w
      - Echo_Dot
      - Spotify
      - Google_Mini

[petro]

Those don’t look like the attributes that you’ve posted. Take a screenshot of the developer tools → states page showing the attributes for input_select.players_home

[petro]

Also, post your entire template and custom button configuration.

[Pablo_Gustavo_Fiscel (Pablo Gustavo Fiscella)]

It’s very weird. This occurs when I don’t have any conditional cards active. I also don’t know what I can do to enter this template when there is no conditional card active. You would also need it to come in when no media player is running. I show you that code too

I show the image of what is being reproduced. If there are several things I show the image randomly but this error occurs when there is nothing playing

            cards:
              - type: vertical-stack
                cards:
                  - type: conditional
                    conditions:
                      - entity: input_select.conditional_media
                        state: Spotify
                    card:
                      type: custom:button-card
                      entity: media_player.spotify
                      tap_action:
                        action: none
                      template:
                        - conditional_media
                        - recently_downloaded
                  - type: conditional
                    conditions:
                      - entity: input_select.conditional_media
                        state: Dormitorio Ana
                    card:
                      type: custom:button-card
                      entity: media_player.dormitorio_ana
                      tap_action:
                        action: none
                      template:
                        - conditional_media
                        - recently_downloaded
                  - type: conditional
                    conditions:
                      - entity: input_select.conditional_media
                        state: Echo Dot
                    card:
                      type: custom:button-card
                      entity: media_player.echo_dot
                      tap_action:
                        action: none
                      template:
                        - conditional_media
                        - recently_downloaded

recently_downloaded:
  template:
    - conditional_media
  name: Reproduccion Actual
  variables:
    i: >
      [[[
        let media = "";
        let activesMedia = [];
        let cant = 0;
        let cantMedias = states['input_select.players_home'].attributes.options.length;
        for(var x = 0; x < cantMedias; x++) {
          media = ('media_player.' + states['input_select.players_home'].attributes.options[x]);
          if(states[media] != undefined && states[media].state == 'playing')
            activesMedia[cant++] = states[media];   
        } 
        let rnd = (Math.floor(Math.random() * cant) + 1) - 1;
        console.log(activesMedia[rnd]);
        if(activesMedia[rnd].attributes.entity_picture != "undefined")         
          return activesMedia[rnd].attributes.entity_picture +'**'+ activesMedia[rnd].attributes.media_title+'**'+ activesMedia[rnd].state;
      ]]]
  custom_fields:
    blur: >
      [[[ return entity === undefined || '<div></div>'; ]]]
  state_display: >
    [[[
      if (variables.i.split('**')[2] == "playing" || variables.i.split('**')[2] == "paused") {        
        let elt = this.shadowRoot, 
          await = setTimeout(marquee,0),
          output = variables.i.split('**')[1];
        function marquee() {
          let state = elt.getElementById("state"),
            container = elt.getElementById("container"),
            spacer = "&nbsp;".repeat(3);
          if (state && container) {
            state.innerHTML = output;
            let ro = new ResizeObserver(entries => {
              let s = entries[0], c = entries[1];
              if (s && s.contentRect && c && c.contentRect
              && s.contentRect.width < c.contentRect.width) {
                state.classList.remove("marquee");
              }
              else if (s && s.contentRect && c && c.contentRect
              && s.contentRect.width >= c.contentRect.width) {
                state.innerHTML = `${output} ${spacer} ${output} ${spacer}&nbsp;`;
                state.classList.add("marquee");
              }
            });
            ro.observe(state);
            ro.observe(container);
          }
        }
        return output;
      }
      return "en espera";
    ]]]
  styles:
    custom_fields:
      media_image:
        - background-position: center center
        - background-image: >
            [[[
              if(variables.i.split('**')[2] != 'idle') {
                if(variables.i.split('**')[1] != 'TV')
                  return "url("+variables.i.split('**')[0]+")";
              } else {
                return "url('/local/img/multimedia_i_news_design.jpg')";               
              }
            ]]]
      overlay:
        - display: none
    card:
      - text-shadow: >
          [[[ return entity === undefined ? 'none' : '1px 1px 5px rgba(18, 22, 23, 0.9)'; ]]]

`  players_home:
    options:
      - dormitorio_ana
      - chromecast 2
      - bdv_n9200w
      - echo_dot
      - spotify
      - google_mini
      - tab_10_pro
`

This occurs when there is nothing to play. When I show with a console.log the result tells me that I have 7 options but nevertheless, followed by that it gives me that error

    console.log(states['input_select.players_home'].attributes.options.length);             return 7
    let cantMedias = states['input_select.players_home'].attributes.options.length;      return error