File Copying Cause Liveview to Reload

During a drag and drop operation, File.copy(src, dest) in my code would cause Liveview to reload. How can I prevent this?

Hi @carter can you provide some details? What kind of file are you copying, and to what folder?

Thanks.

I am copying png from /priv/image/folder1 to /priv/image/folder2. It works but Liveview would just reload after it is done. I have investigated the issue line by line and isolated it to File.copy (also tested File.cp with the same issue).

The drag and drop event is triggered by js with a simple

this.pushEvent(“copy-pasta-img”, {recordset: recordset});

and in the event handler, I do a File.copy and return the socket. Everything works except the page would reload once File.copy is done.

If you’re in development mode I believe I encountered the same issue a week ago!

It’s not LiveView failing in a mysterious and dramatic fashion, but the LiveReload detecting a new asset in /priv/static/images and reloading your dev server.

I moved the dynamic images to a subfolder, say /priv/static/images/uploads and modified my config/dev.exs file’s live_reload pattern to be:

config :example, ExampleWeb.Endpoint,
  live_reload: [
    patterns: [
      ~r"priv/static/(?!images/uploads).*(js|css|png|jpeg|jpg|gif|svg)$",
      ...
    ]
  ]

Note that we’ve added the (?!images/uploads). bit to the first pattern to have it ignore files within the images/uploads subdirectory.

3 Likes

This looks promising!! How can I ignore all subfolders in /priv/static/images?

I tried ~r"priv/static/(?!images).*(png|jpeg|jpg|gif|svg)$", but it doesn’t work.

Hm interesting, that regex should ignore any file inside the priv/static/images/ folder for LiveReload!
Just did a quick regex tester confirmation.

To confirm if it’s LiveReload with or without the regex check your command prompt for logs.
Run mix phx.server and copy/add a file to the modified directory.

If LiveReload is kicking in you’ll see something akin to:
[debug] Live reload: priv/static/images/reload.png

I want ignore all changes in all subfolders irregardless of the files they contain. This way, it doesn’t matter if something changed in /priv/static/images/folder1, /priv/static/images/folder2 etc. I want to just ignore all changes in subfolders in /priv/static/images.

Yeah… I can see the lines below when I drag and drop an image.

[debug] Live reload: priv/static/images/folder2/3490e40e-305b-4493-873f-9be0e682f.png
[debug] Live reload: priv/static/images/folder2/3490e40e-305b-4493-873f-9be0e682f.png
[debug] Live reload: priv/static/images/folder2/3490e40e-305b-4493-873f-9be0e682f.png
[debug] Replied in 14ms