bruno costanzo

Joined

230 Experience
2 Lessons Completed
0 Questions Solved

Activity

Posted in Extending Rails Associations with Custom Features Discussion

Great video! I see the point in the first example where just the User needs to know about the client projects, but if you're creating a module and extending it through different classes, why not just add it in the Project class as a scope method? Anyway, is good to know different forms you have to get similar behavior.

Posted in Dynamic Single Table Inheritance with Rails Discussion

Really cool! How about the tests here. how can you ensure that a model will fail if it have not defined the required methods?

Posted in Google Maps and Google Places Autocomplete API with Rails, Turbolinks, and Stimulus.js Discussion

I am working on a Rails 7.1.2 application with Ruby 3.2.2 and facing an intermittent problem with Google Maps loading. The map sometimes loads in Firefox, but rarely in Brave. There seems to be an issue with a Stimulus controller action not consistently firing, although the event listener for the action seems to execute.

First, following some outdated guides, I started adding this script to my app/javascript/application.js

window.dispatchMapsEvent = function(...args) {
const event = new CustomEvent("google-maps-callback", { detail: args });
window.dispatchEvent(event);
}

window.addEventListener("google-maps-callback", function(event) {
console.log("Google Maps API loaded");
})
and this to the head of my app/views/layouts/application.html.erb:

<%= javascript_include_tag "https://maps.googleapis.com/maps/api/js?key=#{Rails.application.credentials.google.api_key}&libraries=places&callback=dispatchMapsEvent",
defer: true,
async: true,
"data-turbolinks-eval": false
%>

Within this code, I got this error in my browser console:

Uncaught (in promise) InvalidValueError: dispatchMapsEvent is not a function
Although most of the guides I followed suggested this should work, I assumed the error was because the dispatchMapsEvent function was not yet loaded by the time the callback was executed, which is why I pulled the code out of the application.js and passed it to a script within the layout:

window.dispatchMapsEvent = function(...args) { const event = new CustomEvent("google-maps-callback", { detail: args }); window.dispatchEvent(event); } window.addEventListener("google-maps-callback", function(event) { console.log("Google Maps API loaded"); })

<%= javascript_include_tag "https://maps.googleapis.com/maps/api/js?key=#{Rails.application.credentials.google.api_key}&libraries=places&callback=dispatchMapsEvent",
defer: true,
async: true,
"data-turbolinks-eval": false
%>
This seemed to fix the mentioned error, as the console.log ran correctly.

Secondly, I have configured a StimulusJS controller as follows:

views/folder/_some_partial.html.erb

class="form-group"
data-controller="localizators"
data-action="google-maps-callback@window->localizators#initMap"
data-localizators-current-location-value="<%= current_location %>"

and then a app/javascript/controllers/localizators_controller.js:

import { Controller } from "@hotwired/stimulus"

export default class extends Controller {
connect() {
console.log('localizators controller connected');
}

initMap() {
console.log('map init');
}
}

The message 'localizators controller connected appears always', but the 'map init' never in Brave Browser, and sometimes in Firefox (I don't know how the browser is realted)

Just to give further information, I'm in my development environment, and is the same if I use bin/dev or rails s.

As you can see, there are two problems that I don't know if they are related.

The code I had to put as a JS script since with the recommended configuration it didn't seem to be loading and the Stimulus controller action was firing only sometimes, even though the event in @window seemed to be firing every time.

Thank you very much in advance for any help you can give me.