NPM pro-gallery, doesn't load images in live site - netlify

I am trying to use the gallery in production but I am having an issue that it doesn't load until I open my developer tools than all photos appear. Everything works fine on localhost, this only happens when the site is live.
Images are inserted from a list sorted in another file, everything loads on the localhost using GatsbyJS right away, but when I have it deployed to netlify the photos won't appear until I open the dev tools, and magically everything is good

Related

Testing Local mobile web changes in Chrome Dev Tools

Right now I use Angular at work to edit and create a Web App, but we are having some issues where changes i've made are looking fine on Chromes Dev Tools in Responsive and emulating the Screen sizes but when deployed they're not the same and its causing some CSS issues such as the buttons not being in the same place we expected.
What solutions are out there that I can use Localhost with?

Gatsby E-commerce website cache issue with frequent builds

I've built a large e-commerce website with around 1000 products in gatsby which we are deploying every day, sometimes multiple times per day but the problem we are having is that after each update users have problems with content, the links not working and other things like images not showing. However, when you clear the cache or open the website in incognito mode (sometimes on refresh the page) then it's working properly.
I've tried to add this code into the gatsby-browser.js file, but it didn't fix this issue.
export function onServiceWorkerUpdateReady(){window.location.reload(true)};

PWA still showing A2HS popup after install

I have a Progressive Web Application which working fine (can be installed and working offline) on Server 1. We made a new server for testing (Server 2), however the PWA cannot be installed properly here. The A2HS popup shows up, installing seems fine, but the icon has a chrome badge at bottom right, and it is not sowing up in the settings/applications list. Reloading the page causes the A2HS popup again, making new icons next to the old ones.
There are three problems I can though at this moment:
Server 1 has normal URL (https://server1/pwa), but Server 2 uses up
address (https://xxx.xxx.x.xxx/pwa).
Accessing Server 2 from mobile shows a warning at
application/Manifest: “some of the icons could not be loaded”. The
icons from the path can be loaded manually. It resolved 200 both
ways, according to the IIS logs. This warning only shows up on
mobile, desktop version works fine. The mobile is connecting through
4G/VPN. The connection is fast, and the icons are less than 40kb
Some IIS configuration mismatch, but I don't remember configuration
about the PWA, it worked out of the box.
Lighthouse shows perfect score. Everything is checked.
My goal is to install the app properly, so it only shows the A2HS once, and install the app to settings/applications.

Opening a link to download a pdf only works with hard reload and dev tools open

There are a several factors here (Heroku, Node, expressjs, react) as I'm working with a few technologies newer to me, so I'm not sure what the missing piece is.
I have a react/node app that is working for me in my local dev environment (using create-react-app).
My "/" route returns a list of documents, from which I create a list of links. When you click on one, it calls a route that returns a PDF.
This works great locally.
I've deployed it to Heroku and get the following behavior:
Click on link
Instead of opening the PDF, it opens a new tab with the correct URL, but the response is the list of documents instead of the selected PDF.
If I do a hard-reload, I get the same thing.
If I open dev tools in Chrome, I get the same thing.
If I open dev tools AND THEN do a hard-reload, I get the attachment to render!!
If I then do a reload again, it reverts back to showing me the list.
In Edge, I don't need to have dev tools open. Just a hard-reload will render the attachment, but clicking refresh after, brings the list back instead.
Things I've considered:
+ If it were a caching issue, I would expect subsequent reloads to render the PDF, despite whether the Control key were down or dev tools open. Both requests are returning 200, although the one that is not working as expected is returning 200 (from ServiceWorker). The Remote Addresses are also different.
+If it were a routing issue, I wouldn't expect the PDF to ever get rendered properly.
Things I've noticed in hunting this down:
+ The requests are differing
Any guidance is greatly appreciated!
Okay, I've figured it out. The rubber duck helped me :-)
If I don't use https, all is working fine. I'm not sure, however, why dev tools + hard reload allows me to make the request properly.

WordPress can't display uploaded images (3.6)

I'm having a bit of trouble with a client site, on their server (our development server is fine).
We were hoping to push it live today, so we created a test subdomain to make sure his server's okay with the site.
However, the media uploader doesn't seem to work properly. The file will upload, without any error messages, however, instead of displaying the image in the thumbnail preview, it shows a little blue ?.
The file is actually uploaded to the server, but for some reason it can't be displayed online.
For example this should be the location of a newly upload image, but for some reason it can't be accessed.
I was thinking the issue is with folder permissions, but changing everything to 777 didn't seem to do anything. So I'm a little confused as to what's wrong.
Apparently they host a couple dozen WordPress sites and don't have this issue. I did think it's a server problem because it works on two other servers.
Anyone had an issue like this before?
[EDIT]
It turns out deactivating a plugin called Sell Media Watermark does the trick.
However, this plugin is needed so I'm working to find a fix for it :)

Resources