Installing the TMC PWA (Progressive Web App) on your mobile device

We will be shutting down our native TMC iOS and Android apps soon. As such, I wanted to take this opportunity to encourage users to install our PWA for both iOS and Android (the iOS PWA is actually necessary in order to receive push notifications on iOS).

iOS PWA Installation:​

You can install TMC as a PWA on your iOS device by utilizing the Add to Home Screen feature in Safari. Instructions for this can be found on the following Apple support page: Bookmark a website in Safari on iPhone​

​

​

iOS Push Notifications:​

iOS 16.4 finally introduced push notifications for iOS devices. To facilitate this, you should first make sure that notifications are turned on in your Safari advanced settings. This can be done using the following steps:​

1. Open the Settings app on your iPhone​
2. Scroll down and find Safari, and tap on it​
3. Scroll down to the bottom and tap advanced​
4. Tap on Webkit Feature Flags (also called Experimental Webkit Features on some versions of iOS)​
5. Scroll down and turn on the toggle beside "Notifications".​

Here is a video which shows this process.​

​

Then you need to install the TMC PWA (instructions in the section above). When you access the PWA and log in, you should be presented with a prompt that says "TMC would like your permission to enable push notifications". You will be able to click on the "enable push notifications". If you do not see that prompt, then push notifications can also be enabled in your TMC account Preferences. You should then be presented with the default iOS prompt for notifications wherein you can "Allow Notifications" for TMC. If you don't see that, then go into your iOS Settings and tap on the Notifications submenu, then tap on the TMC PWA app listed there, and make sure "Allow Notifications" is turned on for the TMC PWA. There may be some additional options there that you can configure there if you like.​

​

Android and Chrome on desktop PWA Installation:​

When browsing with Chrome on desktop or Android, the app can be installed via the address bar on both mobile and desktop devices. On supported mobile devices, we also display an "Install" button at the bottom of the off-canvas menu, which is accessed by clicking the hamburger menu icon on the bottom right of your mobile navbar (on our default style).​

​

Android and Chrome on desktop Push Notifications:​

On most devices running Chrome, you will be presented with a banner at the bottom of the screen which says "Tesla Motors Club would like your permission to enable push notifications." You can tap on the clickable area to turn it on. Alternatively, you can go directly to your TMC account Preferences and enable it there. After one of the mentioned steps, Chrome may also present you with a browser permission popup asking if you would like to "Allow" TMC to send you push notifications.​

Once the app is installed, it is readily available in exactly the same way as a native app. On mobile devices, that means it can be opened via an icon on the home screen. On desktop devices, it can be opened by searching your system or even pinning the app to your taskbar or dock.

For most devices, we set the app to display a minimal interface. The elements of this interface also vary by browser, but most importantly include navigation controls, including pull down to refresh, and in some cases a floating back button.

Chrome-based apps support application badging, which allows the app to indicate unread messages or alerts directly on its icon.

Please let us know if you have any questions.

 

[Jones1]

Do a video on the Podcast. I liked the app for notifications. Now I only see email notifications for the PWA. Make it make sense. No problem with the PWA. We are too busy trying to keep up with Elon and the stock price.

 

[StephenBrown2]

Do a video on the Podcast. I liked the app for notifications. Now I only see email notifications for the PWA. Make it make sense. No problem with the PWA. We are too busy trying to keep up with Elon and the stock price.

Funny enough, once I enabled notifications for the PWA (using Chrome), I stopped getting app notifications.

 

[danny]

Do a video on the Podcast. I liked the app for notifications. Now I only see email notifications for the PWA. Make it make sense. No problem with the PWA. We are too busy trying to keep up with Elon and the stock price.

Did you check your account preferences? Is it enabled there? And what about for your browser sire settings?

 

[Jones1]

Did you check your account preferences? Is it enabled there? And what about for your browser sire settings?

I’m using Safari. Let me check.

 

[danny]

I’m using Safari. Let me check.

That's where it is on the Preferences page.

 

[Jones1]

Okay. I went here and made changes for Emails. I already had Push Notifications enabled. Thanks Danny.

 

[Jones1]

That's where it is on the Preferences page.
View attachment 979122

Okay it won’t let me enable. Must be a browser setting. I’ll keep looking.

 

[brkaus]

With no carefully collected evidence, it feels to me like it only allows in "target" for push notifications. When I set a new one, the other one goes away.

 

[danny]

Okay it won’t let me enable. Must be a browser setting. I’ll keep looking.
View attachment 979131

I'm not sure if this is still considered an "Experimental feature" on iOS (as I don't have an iPhone on hand), but please try the instructions here:

Enable Safari Push Notifications on iOS: Step-by-Step Guide

Reach out to your reader on the iPhone with Safari Push Notifications on iOS. Click here to learn more and get started

www.izooto.com

 

[danny]

With no carefully collected evidence, it feels to me like it only allows in "target" for push notifications. When I set a new one, the other one goes away.

Can you please clarify what you mean by this?

 

[brkaus]

Can you please clarify what you mean by this?

I setup the PWA on my laptop, and the notifications no longer went to my iPhone. Ditto when I went the other direction.

But, I didn't look at it in detail. It just felt like this is what was happening. Anyway, my notifications are definitely getting turned off on the phone PWA occasionally, for some unknown reason.

 

[danny]

I setup the PWA on my laptop, and the notifications no longer went to my iPhone. Ditto when I went the other direction.

But, I didn't look at it in detail. It just felt like this is what was happening. Anyway, my notifications are definitely getting turned off on the phone PWA occasionally, for some unknown reason.

OK that's interesting. I'll see if I can find out a little more about how it works on iOS.

 

[shahryaran]

For Samsung owners, if you are using Samsung Internet, there should be a download icon next to refresh icon that can install TMC as an app.

 

[Electroman]

Just to capture the floating bar problem I mentioned above. I did get a screen shot. I has not happened again.

The pages were loading slowly, so perhaps a bit of code timed out?

What I am noticing is, on my iPhone:

- the thread pages are loading pretty quick (same as the App). No issues there

- The Alerts icon often seems unresponsive and very slow to load the list of new posts. It eventually loads after some delay, but often I end up clicking it multiple times because of its seeming unresponsiveness.

- Also on that topic the Alerts icon is a bit small and tucked to the extreme bottom right, and so sometimes I am not sure if I clicked. Being in the bottom bar is good. Bottom middle would be better.

 

[danny]

What I am noticing is, on my iPhone:

- the thread pages are loading pretty quick (same as the App). No issues there

- The Alerts icon often seems unresponsive and very slow to load the list of new posts. It eventually loads after some delay, but often I end up clicking it multiple times because of its seeming unresponsiveness.

- Also on that topic the Alerts icon is a bit small and tucked to the extreme bottom right, and so sometimes I am not sure if I clicked. Being in the bottom bar is good. Bottom middle would be better.

You are using one of the "Pro" styles. I assume you tied the non-pro versions.

I think we can move the Account icon to the far right and shift the Conversations and Alerts icons over.

 

[Electroman]

You are using one of the "Pro" styles. I assume you tied the non-pro versions.

I think we can move the Account icon to the far right and shift the Conversations and Alerts icons over.

Yes I am using TPC Pro Dark 2022

Swapping 'Alerts' with 'Account' icon would be great, so that the Alerts is in the middle. IMHO functions that are sparsely used like the 'Account' should not be placed as an icon consuming valuable real-estate. It should be another item on the top left drop down menu. When I open the TMC App anytime and say the alert count is 10, I am touching 'Alerts' icon atleast 10 times. The Account icon on the other hand, I am probably using it once a month.

Also I noticed that in the Default style the bottom bar is positioned a few pixels higher than the Pro style, making it nicely visible on iPhone 12 and easy to touch. Why this difference? Can the bottom bar on the Pro style can be placed higher just like the Default style ?

 

[danny]

Also I noticed that in the Default style the bottom bar is a few pixels higher than the Pro style, making it nicely visible on iPhone 12. Why this difference? Can the bottom bar on the Pro style can be placed higher just like the Default style ?

The pro style uses legacy UI elements and isn't really something we actively support. We simply provided it as some users were complaining when we updated to the latest UI style. I'll see if I can ask a developer to raise it a little, but it's rather low on our list of priorities to be honest.

 

[Jones1]

I’ll just start checking TMC PWA. Like I check Amazon. still no notifications.

 

[danny]

I’ll just start checking TMC PWA. Like I check Amazon. still no notifications.

@Jones1 please navigate to your "Webkit Feature Flags" and make sure "Notifications" is turned on. Please confirm.

 

[danny]

@Jones1 here is a video that shows how to get to your experimental features settings for Safari:

You will want to look for a feature called "Notifications" or possibly "Push API", and turn that on. Then you'll want to go into the PWA, then to your account preferences and make sure Push Notifications are turned on.

I do not have an iPhone so I am trying to get a hold of a friends iPhone so I can properly look into all this. It is not clear to me if this is necessary on iOS 17, but on iOS 16 it appears that browser notifications are still not turned on by default for Safari, as such one needs to enable it manually, in order that TMC's notifications come through.