šŸ”¹ Browser_mod - turn your browser into a controllable device, and a media_player

I never used browser mod’s media player because it was unreliable from the start - it tends to go unavailable a lot for no reason (it’s still happening, i just disregard it. Right now it’s unavailable on 4 from 5 devices, all are online thóugh). So i only use other players: fully’s on android, or hass.agent’s on windows.

1 Like

V2.38

Hi guys, let me know if I need to post this question in a different thread. I am not altogether clear considering how card mod works whether this question rightfully is broswer_mod or frontend (or something else entirely).

I am just wondering whether I have misunderstood what I am reading on github docs for this add-on. I think the - name within the content structure is set somehow as a re-useable variable within the action of the popup - if it has one? Or have I totally got this wrong?

What I am I trying to do? is basically call a service after the user has supplied some data in the popup. The data supplied to the service I want to come from what the user supplied in the popup.

Specifically I am calling evohome.set_zone_override like the below code - this is just a POC.
I am just a few months into HA so if there are some stupid errors, knowing these would be really helpful.

type: custom:mushroom-chips-card
chips:
  - type: entity
    entity: sun.sun
    tap_action:
      action: perform-action
      perform_action: browser_mod.popup
      target: {}
      data:
        browserid: THIS
        dismissable: true
        autoclose: false
        allow_nested_more_info: true
        title: Override the heating?
        size: classic
        entity: input_datetime.test
        right_button: "Yes"
        left_button: "No"
        timeout: 5000
        right_button_action:
          service: browser_mod.popup
          data:
            size: classic
            title: Heating Override?
            dismissable: false
            timeout: 60000
            browserid: THIS
            content:
              - name: p_minutes
                label: Minutes (max 240 [4h])
                selector:
                  number:
                    max: 240
                    min: 0
                    step: 20
              - name: p_entity
                label: Room Selector
                selector:
                  entity:
                    include_entities:
                      - climate.kitchen
                      - climate.dining_room
              - name: p_setting
                label: Target Temperature
                selector:
                  number:
                    min: 16
                    max: 24
                    mode: slider
            right_button: Ok
            right_button_action:
              action: evohome.set_zone_override
              data:
                entity_id: "{{ p_entity }}"
                setpoint: "{{ p_setting }}"
                duration:
                  minutes: "{{ p_minutes }}"

I get errors indicating that the entity passed into the action wasn’t expected. So I suspect ā€œ{{ p_entity }ā€ is being passed as opposed to a valid entity name. I tried using a markdown card to pop the result on the screen and this showed the litteral string ā€œ{{ p_entity }ā€.

So this drives my comprehension question around whether I have misunderstood what can be achieved. If re-useable variables are not a thing, the next obvious question is, what is the right way. I load of helpers I guess, sigh?

You are on the right track. The last action is where you need to adjust. You can’t do your templating inline with the action. You need to do that in a script. Browser Mod will pass the form parameters to the script where you can use in templates directly or rework into script variables etc. A good method is to create your script with the same field names and selectors, test it independently with Developer Tools, then bring it into a UI action like Browser Mod popup action.

Also browserid should be browser_id. If you do wish to only popup on current Browser, you will need to use the fire-dom-event method as Home Assistant action executor does not know about ā€˜THIS’ only Browser Mod does. Check the docs on action targets.

Thank you for the enlightening response. The browser_Id correction and explaining fire-dom-event. All very helpful.

I’ll have a read here on scripts and get it going that way - thank you !

I modified the code to consume the fire-dom-event method, thank you. I can’t seem to now make the nested pop-up’s appear? I am concerned that I constrain the activity as fire-dom-event allows.

type: custom:mushroom-chips-card
chips:
  - type: entity
    entity: sun.sun
    tap_action:
      action: fire-dom-event
      browser_mod:
        service: browser_mod.popup
        target: {}
        data:
          user_id: THIS
          size: classic
          dismissable: true
          autoclose: false
          allow_nested_more_info: true
          title: Override the heating?
          entity: input_datetime.test
          right_button: "Yes"
          left_button: "No"
          timeout: 5000
          right_button_action:
            action: fire-dom-event
            browser_mod:
              service: browser_mod.popup
              target: {}
              data:
                user_id: THIS
                size: classic
                title: Heating Override?
                dismissable: false
          .. truncated .. 

Is it correct to fire-dom-event in the nested pop-up or is that being handled in the context of the parent fire-dom-event and therefore ā€œtargetingā€ local session, if that makes sense?

On an entirely separate topic - is it possible to reduce or even stop the event log being flooded by browser_mod events ?

fire-dom-event is only required from the initial action to make it a Browser call. For the next call you don’t use fire-dom-event as it will already be a Browser call as it is an action on a popup per…

The second way is as a browser call. This is when the service is called from a dashboard fire-dom-event action, as a part of a browser_mod.sequence call or as a browser_mod.popup _action .

Do you mean the Home Assistant Logbook? Registered Browsers will send through activity updates which are then Logbook entries. If so there are two methods.

  1. If you are only using popups with Browser calls, and not wishing to target Browsers any other way, you can turn off Browser registration and delete any existing Browsers. This then limits Browser Mod functionailiy to local Browser calls only.
  2. Exclude Browser entities from being Logged. Check out Logbook - Home Assistant (Exclude).

Awesome - thank you so much.

I do need to target the kids browsers so a series of excludes it will be !

1 Like

:mega: Browser Mod v2.4.0 is getting close to release, hopefully to coincide with Home Assistant 2025.6 release. v2.4.0-beta.3 pre-release is available for testing. While significant testing has been done in development, it is always good to have a few more testers as there are many different Home Assistant configurations out there.

Some standout new features included in 2.4.0:

  1. A Default action Frontend settings option where you can run an action sequence on browser load/refresh. The sequence is run by same code that runs popup _action:s.
  2. Supports new Sidebar settings dialog being inrtoduced in 2025.6.

See v2.4.0-beta.3 release notes for all new features and fixes to be released in 2.4.0.

2 Likes

:mega: Browser Mod v2.4.0 has been released :mega: See v2.4.0 Release notes to read more about new features and what has been fixed.

3 Likes

First up, with the current Browser Mod versions there are issues with Media players not coming active because the interaction check needs some work. This is being worked on currently, noting that for audio to work there will always need to be a first interaction with device (from my active testing, most devices can play muted video without interaction).

If the Media player is working with radio, then TTS should work. I have tested the following in Developer tools to my phone. Also via Browse media and it works. Not sure how to debug from here.

action: tts.speak
target:
  entity_id: tts.google_translate_en_com
data:
  cache: false
  media_player_entity_id: media_player.iphone_real
  message: Test 1 2 3

EDIT: It may be with how the media file URL is sent to the Browser. I will check and see if there are cases where it may not work 100%.

EDIT+: Once the TTS fails, see if the extra attributes of the media player shows source:. It will be a URL. See if this URL plays correctly from the device which is failing. That may provides more clues as to what is going on.

I copied & pasted your action (replacing the entity id) and it still does not play.
The media player state after invoking the action looks like this:

friendly_name: laptop_floorp
supported_features: 152463
type: browser_mod
browserID: laptop_floorp
volume_level: 1
is_volume_muted: false
media_content_id: media-source://tts/tts.google_translate_en_com?message=Test+1+2+3&cache=false&tts_options=null
media_content_type: music
media_position: 0
media_position_updated_at: 2025-06-12T08:10:42.677261+00:00
source: http://192.168.1.230:8123/api/tts_proxy/4Zk08lP28aADQyLZJdRfwg.mp3

If I open the source url I can play the mp3 in the browser and that sounds correct.
In the brwoser developer console I get the following:

Mixed Content: Upgrading insecure display request ā€˜http://192.168.1.230:8123/api/tts_proxy/Pcfnz_zK7-5-pq8dfPU5Cw.mp3’ to use ā€˜https’
Pcfnz_zK7-5-pq8dfPU5Cw.mp3
Failure writing unhandled promise rejection to system log: Error: Cannot parse given Error object
    parse error-stack-parser.js:35
    fromError stacktrace.js:106
    fromError stacktrace.js:105
    t log-message.ts:36
    hassConnected logging-mixin.ts:66
logging-mixin.ts:77:18
    hassConnected logging-mixin.ts:77
Uncaught (in promise) DOMException: The media resource indicated by the src attribute or assigned media provider object was not suitable.

as additional info I access my ha instance vie reverse proxy, i.e. https://ha.example.org
If you need any more tests etc just let me know, and thanks for your help!

So it looks like this comes down to HA/TTS returning a URL that can be played external. A quick look and I have found one discussion about this. I had a similar problem when testing media to my local virtual devices and had to change my internal network from automatic to my laptop address. Your scenario is different in that you may need to change internal to your reverse proxy address.

1 Like

Changing the internal url to the external one made it work, thank you so much!

1 Like

ICYMI Browser Mod 2.4.0 uses the new Sidebar Settings dialog introduced in HA 2026.6. So you can edit/review Sidebar settings in a visual form.

1 Like

What an awesome app!

Really dumb question: Does this require the target browser to be actively logged into Home Assistant? I ask because I have an automation that fires an RTSP feed of my front door camera to my browser for 30 secs when person detection is triggered. This seems to only work on browser when I am connected to HA via the browser. But I would really like it to pop up the camera feed even when I am not connected to HA (pipe dream perhaps).

yaml from automation action:

action: browser_mod.popup
metadata: {}
data:
  dismissable: true
  allow_nested_more_info: false
  browser_id:
    - 39059a698c4366c79819cc73afe8f59c
    - ef04a371ea5207184a894281faa36a63
    - b686402ec1daf833d493aa9992bfafe4
    - 0b78e23cc0f4d0922891c07841f31235
    - 6ffccd939fbd6b371452bc7f75399d1c
    - a090f7f5124c6adfa700f1752e755a2e
  content:
    type: custom:webrtc-camera
    url: rtsp://myuserid:[email protected]:554/stream1
  timeout: 10000
  size: fullscreen
  title: Front Door Camera

1 Like

Excellent! That’s what i call ā€œnice editingā€ā€¦ and what’s best i can edit sidebar order from admin account for all other users, as it seems, so i don’t have to run from tablet to tablet and edit there…
thanks for helping with this addon!!!

1 Like

Yes, you need to be logged into Home Assistant. Browser Mod works within Home Assistant.

1 Like