Why my changes are not displaying to the browser? - javascript

(this a long text but it's necessary for you to understand what I'm struggling with)
I've been trying to find a solution to this but I just couldn't find any info related to this so I wonder if it has to do something with my computer.
The problem is that when I am coding working on website in neither Sublime Text or VSC, (in the beginning everything was okay, I used to refresh the page or use a local server and my changes display on the Web page) any changes I make in the .html, .css or .js files don't show on the browser.
I tried closing and re-opening the text editor and the files, (that used to work at first) but now that doesn't work anymore, any simple change made after this "forzing" happens, just doesn't display on the browser. I tried also using opera, mozilla, chrome, and the problems persist.
I sent the files once to a friend of mine, he opened the .html file and my changes were working. He resend me the code after he used it, I pasted it (the same I sent him before that wasn't working) and then magically it worked!!!!
Now every time that happens I have to have Another personas computer to open the .html file, they resend it to me, I paste it again in order to make it work. This is so annoying and frustrating. If any of you could help me with anything to fix this, I'd very much appreciate it.
So in short, until some point my changes are displayed, but after that, the page stays the same as when it "freezes" and no matter which file I modify, the page just doesn't show changes after that freezing point
Thanks for your atttention

Since it doesn't work on a local computer, you can always use an online editor like Replit or CodePen (they worked quite well for me) ...

It could be that the files aren't correctly saved into your working directory. If you go into your terminal and navigate to the directory these files you're working on are in and type ls it will show all the files in this directory. If your files aren't there then you know you didn't save the files correctly into your working directory.

Related

Tempalte File won't update in Browser

im trying to change some behavior of a webpage. The page is built using SMARTY so the file that won't update is a .tpl file. Containing mostly JavaScript. The whole thing is weird because on my local drive (IDE) the file is the way i want it to be, it is the correct version on the server when i check it with SFTP.
BUT if i open the page with a browser, even a newly installed one, the code inside that page is the old version.
Now i can't send any error because there obviously is none.
So im lookin at a problem i can't fix or even begin to untangle.
I tried following things:
Restarting apache2
Deleting the file and uploading the correct version (here i might add the site broke when i deleted it and tried to view it)
This has been bugging me for a long time so it seems time couldn't fix it either.
I hope somebody has any idea to why this is happening!
Thanks
Clear (delete all cache files) smarty cache!
More details about cache dir: https://www.smarty.net/docs/en/api.set.compile.dir.tpl

Header Background Not Displaying on Github site, works fine on local host

So, I've been setting up a website for my church camp. I downloaded a template, personalized it, and everything looked fine running locally through my computer (Firefox). However, when I uploaded it to Github, the main header background does not show up, but simply is white. Nothing shows up, nothing changes. When I check the local file, it shows up perfectly. Is there something that I'm missing? I am hosting it through Github pages, at https://tjsanzen.github.io/camp
I've tried changing all the CSS, I've tried changing the HTML, making sure the databases are updated, nothing seems to work. No matter what I do, it continues to stay a white blank background.
You can view all my code for it at https://github.com/tjsanzen/camp
It should have the picture of the kids walking up the hill as the background, and works fine on other pages, but instead no matter what I do, it remains a white screen. I'm not sure what is wrong, but any and all help would be appreciated!
In your CSS, you reference img/header.jpg, but in your repo, that image is uploaded as img/header.JPG. Changing the case should fix it.
Your operating system probably has case-insensitive file names, making JPG effectively the same as jpg, which is why it worked on your localhost. For GitHub Pages, apparently, file names are case sensitive. This could be because the servers running Pages have case-sensitive file names, or because the application interpreting the HTTP requests enforces case sensitivity.

Duplicated Mapped Javascript Source not Saving Changes on Chrome's Dev Tools

I'm making a local web page (.html) that loads a few .js files and am having trouble using Google Chrome's Developer Tools.
Definition
The problem I'm having has to do with the Source Panel: I have one source tab open with a specific file and when I open this file by clicking the console or the source file at the left, randomly a duplicate is created instead of just redirecting it to the one already open.
Both will have the same file-path:
Both will allow me to write and save the file (even showing/hiding the asterisk correctly)
Only one of them will correctly save the contents to disk.
I have to fix it by closing both files and opening it again, but sometimes I can't see that there is a duplicated file and it causes me to fix a problem only to find out that the file wasn't actually saved, reverting completely every change I made to that file when I refresh the page.
Example of the problem
The most common appearance of the bug is when I'm doing the following:
I identify a console.warn / console.error / syntax error log in the console
I click the line that caused that log (at the rightmost of the console) and I'm redirected to the source panel, where a new source file tab opens and I begin editing it.
Somewhere in the source tabs is another source file of that same file (with the same filepath): That tab should be the one I was editing: only this original tab will correctly save changes made to the file.
I fix the random javascript problem in the file that I was lead to by clicking the console.
I hit Ctrl+S (or Right Click > Save), the asterisk that indicates a unsaved file disappears. At that point Chrome expects to have saved the file successfully, but it didn't (I can check by opening the file in Notepad)
I hit F5 to refresh the page.
Chrome loads the old, unsaved file, erasing all the changes I made in the source file.
Sometimes the very same steps doesn't create a duplicate file, but all I have to do is refresh and try again until it does. Recreating this bug is a matter of chance, I can't predict or pinpoint its causes either.
When refreshing the page with the Dev Tools open, there's a small chance that it will creates a broken mapping, where the mapped project becomes only partially mapped
even though it was fine seconds before: (only restarting chrome fixes that)
This last paragraph may or may not have something to do with the problem but I can clearly select and open the "fake" file and the "real" file even though they have the same file path.
I made this gif to show how the file paths are identical to each other in the Dev Tools: http://i.imgur.com/ULlbskO.gif
Details of the setup
I'm using the local file system (file:///) strictly, there is no localhost or server being used to host my application, it is pure HTML + Javascript.
I'm using Google Chrome 57 for Windows without any extensions, but I've been having that problem since December, 2016.
My project was mapped by adding the folder to the workspace and mapping it to a local file, which used to work in the past.
Here's a picture of my configurations: http://i.imgur.com/IEmE3zG.png
Things I've tried
Clearing Chrome's Cache
Removing the project from the Source Panel workspace and adding it again
Reinstalling Chrome
Moving the project path to somewhere else
Searching on Google
Letting go / Accepting defeat (I've grown too dependent on the tool)
Waiting 2 months for someone to have this problem too and post it somewhere in the internet
Questions I need help with
Can I minimize/fix this problem in any way?
Has anyone dealt with this before?
Does someone know if this is a Chrome bug or am I doing something wrong with my workflow?
Found the answer myself after several months working with web development.
The duplicated file has been fixed in Chrome since the time I made this question, but files keep loosing "connection" with the local file system (green dot that marks them as sync'd with local) randomly, which made me investigate and I finally found the reason:
What's happening is that Dev Tools is trying to save the file and, when it retrieves it it loads from cache (because my local web server was sending cache-specific headers), which makes the browser think that file file is not actually the one it saved, so it stops its syncronization!
To solve it, all I had to do is ensure my local web server is disabling any form of cache for my javascript files, which I can check from the network panel:
My local web server was sending cache headers for 1 hour, which made chrome open the cached file, which was different from my edited file which was an indication that the file is not the one it saved.
After changing the server to serve static content without the cache headers, everything went smoothly and files kept sync'd correctly!

Js extension modification not showing up in magento

So I have installed an extension in magento for a popup. The extension worked fine but i wanted to change the size of the popup wich is calculated in a js (fancybox). When I finally made it to make the changes that I wanted I noticed that Magento is not serving me the new modified javascript file.
This is what I tried so far by googling all around:
Refreshing the cache
Flush the js/CSS cache
Flush the store cache
changing permissions on the file to 666 then back to 644
changing the js merge on or off
Checking the cache in the database (all clear)
Checking if unsecure route and secure route are spelled fine (in the database and in magento admin panel, not very sure how this work though)
I am going mad.
One more thing:
If I access the js file from secure path
https://mysite/jspath/jsfile.js (it shows the old file)
And if:
http://mysite/jspath/jsfile (it shows the new file)
http://mysite//jspath/jsfile (it shows the new file)
Since I am not the only admin in the site I don't know if someone else made change to some magento configuration
Any idea is welcome and appreciated, thanks
If compilation is on, re run the compilation process.
Due to the fact that it is serving up the old file still, it seems like there is still come caching there. You say you flushed the js/css cache. Can you flush all caches and see if its still a problem?

Updated website through FTP but still showing old content

I am working at a project on my webhost. Until today everything went fine, but now I save the files, they update on the ftp but when I refresh the my webpage the old content shows up, not the updated one.
I checked the FTP, the files are updated with the new content and saved. I checked with the Chrome Dev Tools and I keep getting the old content from the files I work on.
I tried deleting the cache a few times but it only worked temporarily(once), and then again the content not updating.
I work with php, css and javascript files, all having the same problem.
What is wrong?
This is because Cloudflare automatically saves some files (i.e. Javascript's, CSS...). When you're in that kind of problems, in Cloudflare you should go to your page's settings and then "Cache Purge", you purge the cache and then it should work nice.
SOLUTION:
It was because of a CDN I was using, called CloudFlare. I have no idea why, but it kept the old content instead of updating the new one.
Be careful when using CDN's.

Categories

Resources