Olen / lovelace-flower-card

Lovelace Flower Card to match the custom plant integration

Home Page:https://github.com/Olen/homeassistant-plant/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Flower card doesn't work for 2023.9.beta (b0 until the current b2 tested)

mhoogenbosch opened this issue · comments

Getting the following error:

Unhandled promise rejection from Edge 116.0.1938.62 on Windows 10 TypeError: Cannot read properties of undefined (reading 'min_temperature') FlowerCard.render (/local/lovelace-flower-card/flower-card.js:160:63) render (src/lit-element.ts:160:23) update (src/reactive-element.ts:1329:13) performUpdate (src/reactive-element.ts:1261:16) scheduleUpdate (src/reactive-element.ts:1233:24)

commented

I can't replicate it on 2023.9.0 (Google Chrome)

Did something fix it, or is it still a problem?
Are you running the latest version of the card?

Can’t see the card. Using version 3.0.0, which is latest stable as far as I can see, and 2023.9.1 of ha. Also installed 3.0.1beta to try and see if it is any better, but it stays empty.

Card code:

type: vertical-stack
cards:
  - type: custom:flower-card
    entity: plant.pannenkoekplant
    show_bars:
      - illuminance
      - moisture
      - conductivity
      - temperature
    battery_sensor: sensor.plant_sensor_4019_battery
  - type: custom:flower-card
    entity: plant.hangplant
    show_bars:
      - illuminance
      - moisture
      - conductivity
      - temperature
    battery_sensor: sensor.plant_sensor_55f5_battery
  - type: custom:flower-card
    entity: plant.hal_plant
    show_bars:
      - illuminance
      - moisture
      - conductivity
      - temperature
    battery_sensor: sensor.plant_sensor_a834_battery

Using EDGE for browser, but also doesn't show on my iphone, but also on EDGE i'm now realizing. I checked chrome on my Win11 device, but also don't show.

I can't however find any logs of it anymore.

Also adding a new card doesn't show the card.

Is there anything else I can do to troubleshoot?

commented

Are you sure the card is properly installed?

Does the card show up in the GUI when you click the "+ Add Card"-button and search for "Flower"?

Going to check in two weeks. Short holiday now. Thanks for your replies.

I can't seem to install this on 2023.09. I've done it through HACS and verified the js was in www/community, but I still see no flower card in my dashboards. Also tried adding the resource manually, no luck...

Same issue here with:
Home Assistant 2023.10.1
Supervisor 2023.10.0
Operating System 10.5
Frontend 20231005.0 - latest

Yes the card show up in the GUI when you click the "+ Add Card"-button and search for "Flower" - I can select entity, battery sensor etc. but afterwards the new card does not show up in the dashboard.

commented

Just started to see the same, it would appear - I simply restarted HA, then 'lost' the card.

I've tried re-installing, deleting and re-installing, beta version - same same.

Home Assistant 2023.10.1
Supervisor 2023.10.0
Frontend 20231005.0 - latest

Haven't dug any further, yet.

EDIT: Firefox developer tools, flower-card.js is loading (gets a 200)

http://ha:8123/hacsfiles/lovelace-flower-card/flower-card.js?hacstag=297423025300

But I do see:

Loading module from “https://unpkg.com/lit-html@3.0.0/lit-html.js?module” was blocked because of a disallowed MIME type (“text/plain”).
[plants](http://ha:8123/lovelace/plants)
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://unpkg.com/lit-html@3.0.0/lit-html.js?module. (Reason: CORS request did not succeed). Status code: (null).

Module source URI is not allowed in this document: “https://unpkg.com/lit-html@3.0.0/lit-html.js?module”.

Uncaught (in promise) http://ha:8123/hacsfiles/lovelace-flower-card/flower-card.js?hacstag=297423025300 load_resource.ts:13:35
GET
https://unpkg.com/lit-html@3.0.0/lit-html.js?module
CORS Failed

	
GET
	https://unpkg.com/lit-html@3.0.0/lit-html.js?module=
Status
500
VersionHTTP/2

same problem
got error : Custom element doesn't exist: flower-card.

Home Assistant 2023.9.2
supervisor-2023.10.0

commented

Opening the below:

https://unpkg.com/lit-html@3.0.0/lit-html.js?module=

Shows:

Cannot generate module for lit-html@3.0.0/lit-html.js

SyntaxError: unknown: Support for the experimental syntax 'logicalAssignment' isn't currently enabled (6:2831):
commented

Re-installing version 2.1 (in HACS) works for now - as it doesn't use the above lit-html source/version 3.0

Re-installing version 2.1 (in HACS) works for now - as it doesn't use the above lit-html source/version 3.0

How did you do this? I am also having the same issue, but I have tried both:

  • "Redownload", while selecting 2.1
  • "Remove", then selecting version 2.1 when installing

In both cases I ended up with 3.0.0, for whatever reason. 🤔

commented

I wondered if it was just me - I assume a HACS bug.

Basically, the 2nd time I tried to install 2.1, it then installed correctly - rather than 3.0.

Re-download, select 2.1, it installs 3.0.0 again anyway, repeat and it actually installs 2.1.

commented

Another work around for 3.0:

  • Delete lovelace-flower-card/flower-card.js.gz
  • Edit lovelace-flower-card/flower-card.js
  • Change to:

import {unsafeHTML} from 'https://unpkg.com/lit-html@2.8.0/directives/unsafe-html.js?module';

I wondered if it was just me - I assume a HACS bug.

Basically, the 2nd time I tried to install 2.1, it then installed correctly - rather than 3.0.

Re-download, select 2.1, it installs 3.0.0 again anyway, repeat and it actually installs 2.1.

this one worked for me after 3 re-downloads, the workaround for 3.0 didn't work though.

commented

I wondered if it was just me - I assume a HACS bug.
Basically, the 2nd time I tried to install 2.1, it then installed correctly - rather than 3.0.
Re-download, select 2.1, it installs 3.0.0 again anyway, repeat and it actually installs 2.1.

this one worked for me after 3 re-downloads, the workaround for 3.0 didn't work though.

I would imagine it was most likely a local cache issue - but you do need to delete the gz and then clear local cache, for it to pick up the changes to the .js.

Going back to 2.8.0 is (likely) what it was before, before the 3.0.0 'latest' version was released today.

I wondered if it was just me - I assume a HACS bug.
Basically, the 2nd time I tried to install 2.1, it then installed correctly - rather than 3.0.
Re-download, select 2.1, it installs 3.0.0 again anyway, repeat and it actually installs 2.1.

this one worked for me after 3 re-downloads, the workaround for 3.0 didn't work though.

I would imagine it was most likely a local cache issue - but you do need to delete the gz and then clear local cache, for it to pick up the changes to the .js.

Going back to 2.8.0 is (likely) what it was before, before the 3.0.0 'latest' version was released today.

Yeah I had to empty my browser cache and then this fix worked.

Let this be a lesson to us all: ALL VERSIONS SHOULD BE PINNED. 😆

commented

It is really weird. I have not had any issue with the card in any of the latest releases.

Anyway, I will soon release the completely rewritten card from #47

commented

Please try the latest 2023.10.3

It is a major rewrite and should fix any issues.

Fixed for me! Thank you!

Please try the latest 2023.10.3

It is a major rewrite and should fix any issues.

Before I got an error stating the card didn't exist. Now all my plant cards look like this:

image

commented

Yeah, you were a bit early on updating the latest beta.

Upgrade again to the 2023.10.5 beta I just released, and it should be better.

Yeah, you were a bit early on updating the latest beta.

Upgrade again to the 2023.10.5 beta I just released, and it should be better.

It is!

image

The alignment of the progress bar and the values next to it seems a bit off though, but it is working now :)

commented

The CSS is not exactly the same as before, as this version also support compact mode, but I am happy to accept PRs from people more into graphcal design than I am...

The CSS is not exactly the same as before, as this version also support compact mode, but I am happy to accept PRs from people more into graphcal design than I am...

I'm not a designer either but it seems to be caused by padding-top: 8px in the .header element.
This class is being used in both the actual header (plant name / species) as well as the displaying of the value, it shouldn't probably be used like that for the value.

commented

Yeah. Saw the same, and just pushed a new beta that looks better.

image

Should probably not use the "header" class for the label, but refactoring the CSS is not highest on my list atm.

Yeah. Saw the same, and just pushed a new beta that looks better.

Yep, it looks fine now. Thanks 👍🏻

this last beta looks perfect!
image
I do tend to have some issues with the last attribute (the mol one) because most times it doesn't detect 0 as a real value

commented

Closing this for now

where can i find the beta ?