Value sent on outgoing port not received on first render

[curiouslearn]

Today, I posted a question about strange behavior related to input value updating. Before someone suggests a solution, I am trying to do a workaround. For this I thought that I will control this input completely from JS. To do so, however, I would prefer to send the initial value from Elm. So I wrote the following port code:

   port startTsPort : JE.Value -> Cmd msg

   app.ports.startTsPort.subscribe(function(val) {
        console.log("from startTsPort: ", val);
    })

When I first do a fresh load of the page (no cache) nothing is logged to the console. However, if I just refresh the page again, then the value startTsPort is logged as expected.

My question: How do I ensure that the value is received on the JS side on the first load?

[curiouslearn]

On further trials, I figured that this is likely due to the fact that when Elm sends the value to JS, the JS is not yet ready. I think this might be the case because if I insert a wait (using Process.sleep) and then send the value, it is logged to the console on the initial fresh load.

Updated question: Is there a DOMContentLoaded on Elm, so that I can send the value after the DOM is loaded and ready to go? Using an arbitrary sleep does not seem like a good solution?

[Libbum]

@curiouslearn

Is there a DOMContentLoaded on Elm, so that I can send the value after the DOM is loaded and ready to go?

Not officially AFAIK. Could you give me a rework of your code with this new implementation?

If I understand what you’re saying I think its a similar problem to what I’ve come across already.
Take a read of this thread:

requestAnimationFrame problem when using --optimize

I’m doing some stuff with D3 and sending updates through ports. One port is having issues when I compile with --optimise—it works fine in debug mode however. I need D3 to select the #map div and do work on it, but this is rendered in my View, so I use requestAnimationFrame to make sure the View is rendered before starting the D3 commands: port drawMap : () -> Cmd msg app.ports.drawMap.subscribe(function() { requestAnimationFrame(function() { drawMap(); }); return null;…

There’s currently no nice solution to this one either. I’ve kept the wait for element implementation in my solution. So that’s not too different from an arbitrary sleep.