My react site shows up blank on mobile browsers - javascript

I deployed my react site with netlify here https://clusterfy.netlify.app/ I tried it on my computer and it works, but on my phone it doesn’t. So far I’ve tried to change the basename of Browser router to “/React”. added a homepage element in package.json that points to the root of the site. I got rid of %PUBLIC% and replaced it with the link to my site. Here’s the repo for it https://github.com/andrewpaige1/clusterfy-front-end

I was able to solve this by pushing one component at a time. I ended up figuring out it was an issue with the react-sketch library or jsdom. Not sure which one, but I don’t want to find out

This seems to be working on an iPhone with iOS 13.
As a note, your above Git repo link is either private or on a different account.

Related

Is it possible to view a webpage that is being edited in vscode.dev?

If we are using vscode in the browser to edit an html file or project, is there a way to view the page?
I think I know what you mean.
On my chromebook I use vscode.dev in one browser tab, and then just drag and drop the .html file in to an empty browser tab and it can run Vanilla JS, CSS3, and HTML without anything else.
Refresh after each save, or install a live server. You could also have VScode running node, or whatever, in the background and just edit in vscode.dev, but that seems a bit excessive.
(Before I was using Crostini to run VScode on my chromebook and it would sometimes become very slow, buggy, or keep flickering (gpu style), and I'd have to restart/kill crostini to fix it, so finding vscode.dev has really helped when I can't find time to get to my workstation.)
CodeSwing is an extension that works in vscode.dev that does this.
Description: Interactive coding playground for building web applications (aka swings).
Id: codespaces-contrib.codeswing
VS Marketplace Link:
https://marketplace.visualstudio.com/items?itemName=codespaces-Contrib.codeswing

React Native - Expo Stuck on "Downloading Javascript Bundle 100%"

For months I've been working on this project and never once came across this issue.
Suddenly expo does not go beyond the splash screen, I've searched multiple forums and none of the suggested solutions worked.
I've tried:
Uninstalling and reinstalling expo (both mobile and PC)
Clearing expo data on mobile
Stopping remote debugging
Clearing yarn cache
Undoing last known changes.
Updating my Expo CLI
I commented everything and prevented navigation away from the startup page, then tried printing only a text output in a View.
I built a new blank expo project which works, but I'd rather not transfer all of my code to a new project, it doesn't seem like a logical fix since the new project would just become the old once everything is moved.
There are no errors in the code, I can deliberately cause a syntax error and it'll display as usual with the error screen on mobile and in the terminal log, once the error is fixed it goes back to not passing the splash screen again.
Update:
I've commented every line in the project and removed comments one by one to see when the problem occurs. Here is what I've found, it occurs:
When I include import { Ionicons } from "#expo/vector-icons"; but it doesn't cause the same issue when the same import is used in another route.
When I include Stylesheet.create({...}) even though Stylesheet works in other routes.
When I include import * as ImagePicker from 'expo-image-picker'; and this works fine when used in other routes also.
There doesn't seem to be a pattern.

Old mapping showing up with Workspaces. How can I establish a new mapping and/or close out a previously used port?

So this is a follow up question to an earlier question I had regarding a Udemy course on "Advanced Javascript I am taking. I am currently trying to follow along with a lesson on IIFE.
The instructor is using Chrome DevTools to show JS examples, and created the following three snippets - main.js, other.js, index.html.
As per an earlier question I had answered, it appears that the instructor is using Workspaces to map files from a local directory to work on them in Chrome DevTools (otherwise the index.html wouldn't function in DevTools just using snippets)
So... I paused the Udemy course to complete this short Workspaces demo. After completing the demo, I went back to the Udemy course, created a local directory with the main.js, other.js, and index.html files and tried to follow the instructions per the Workspaces demo for my Udemy files.
However, after running in my js-advanced/IIFE directory and navigating to localhost:8000 in Chrome, I still see the old index.html from the Workspaces demo. Even after navigating to Sources > Filesystem and opening up the new folder, I can't get the page to map to my new directory.
I am assuming that there's something I'm missing regarding ports being opened and not closed after following the tutorial. But maybe not. Can someone please explain what I'm doing wrong?
P.S. I'm technically using Brave Browser but it's built on top of Chrome so I don't think that should matter.

Problems opening javascript github examples

So I want to start using dc.js package to create a few dashboards, and I've found this tutorial:
https://github.com/austinlyons/dcjs-leaflet-untappd
I've downloaded the entire folder and attempted to open the html to see whether it works, but I only get some parts of the page (no data, no graphs, you can see the expected and gotten image attached). I've had the same problem with some other tutorials that I've found, and can't figure out why. I can open the page in the browser when it is a link like:
https://austinlyons.github.io/dcjs-leaflet-untappd/
Any ideas? I am using Chrome btw, but it doesn't work in IE either.
You need to run python -m SimpleHTTPServer in your terminal.
Try it yourself
If you want to play with the code as we go, I recommend downloading
the source code from this GitHub repository, navigating to the
directory where the files are located, and kicking off Python's
SimpleHTTP server so that you can see your visualization in your own
browser at http://localhost:8000 (If this is new for you, see this
link for a bit more information).
If anyone is interested there is a very nice workaround for those not willing to play around with a server. For some reason Firefox allows the opening of such pages, so one can test D3 and similar code in it without having to run a server.

Magento Your Checkout Progress Panel does not prepopulate information

I have been having this issue for quite some time now and have been trying to find the problem but have come to no solution. I am hoping you can give me some insight as to fix this problem.
My live site is working on 1.8.1.0 with a custom theme from Emthemes (latest version). PHP Version 5.4.28. I have development sites running 1.9.0.1 right now and the issue was not fixed in the recent release. I also have my development sites running PHP Version 5.5.12 with no issues (for people looking at upgrading to latest PHP).
First, I contacted my Custom Theme provider and they stated the issue was with Magento base files since the "Your Checkout Progress" Panel does not work with Base theme either. Has anyone else experienced this?
Next, I have looked at every Forum post related to this issue and no solution worked for me.
I have researched other sites operating on Magento platform and the "Your Checkout Progress" Panel is working perfectly.
I am under the assumption from reading forums that the issue is either caused by opcheckout.js, checkout.xml or onepage.phtml but I have applied all of the fixes I found and nothing seems to cure this issue. I have also tried reverting to the base files but still nothing.
If you visit my website and add a product to cart then Proceed to Checkout you will notice the "Your Checkout Progress" does not update as you walk through the steps for Checkout.
My website is www.trucatchtraps.com
Any help with fixing the "Your Checkout Progress" will be greatly appreciated.
Thanks,
#user3383912 - Thank you for pointing me in the right direction.
I did not plan on trying this because when I talked to emthemes they said the issue was happening on the base theme as well. But when I disabled my theme, I noticed the "Your Checkout Progress" was actually working like it should.
After doing a little debugging, I noticed one of my extensions was overriding:
checkout/onepage/billing.phtml and shipping.phtml
So I hide these two files and brought the base billing.phtml and shipping.phtml just to make sure it would work, and voila everything was working like it should.
Then I noticed billing.phtml and shipping.phtml were extremely outdated (2009) so I updated with the new info from Magento 1.9.0.1 base files.
So I compared the two versions of the files and updated accordingly, I was still having issues. But what I did not realize is I have another extension working inside billing.phtml which was causing the issue in the first place. When I removed the 'Newsletter Opt-in' extension from billing.phtml everything was working again! So I have now moved the Newsletter Opt-in extension code to agreements.phtml and no problems.
FYI: Once I removed the Newsletter Opt-In code from my original outdated billing.phtml file, everything worked. So updating the file with the latest info from Magento 1.9.0.1 was not the solution but still needed to be done anyways.
This entire problem came from an extension that I did not even want to place on the website, but was told to do so...

Categories