Month: November 2020

Safari 14 has added support for the Web Extensions standard, which I consider a clever move on Apple's side that deprecated Safari's previous .safariextz-style Safari extensions. While there is great documentation for creating a Safari Web Extension from scratch or for converting a Web Extension for Safari (and at least the outlines for converting a legacy Safari extension to a Safari app extension), the documented path currently ends at building and running the application. This post documents the steps for submitting and distributing a Safari App Extension.

The post assumes you already have an Xcode project either created manually or via the converter script and that you use Swift. Here is an example build script for one of my extensions for reference. Some of these steps may improve or change over time for new versions of Xcode; this guide was written for Version 12.0 (12A7209). Caveat: this is my first time interacting with Xcode, so if any of the steps do not make sense, thanks for correcting me.

1. Change the bundle identifier of the extension from com.example.foo-Extension to com.example.foo.Extension (that is, replace the '-' with a '.') and reflect the change in ViewController.swift. For some reason this is necessary.
2. Change the App Category.
3. Change the version number for app and extension.
4. Update the build number in app and extension.
5. Create a new certificate via your developer profile.
6. Create a new app via App Store Connect.
7. In Xcode, run Product > Build and then Product > Archive.
8. In Xcode, open Window > Organizer and then first validate, then distribute (don't change any of the settings).
9. Hope for the best…

I successfully went through the process with two extensions now:

• Service Worker Detector
  
• Link to Text Fragment
  

(Thanks to Timothy Hatcher who has been very helpful in navigating me through the process.)

This post appeared first on https://blog.tomayac.com/2020/11/09/submitting-and-distributing-a-safari-app-extension/.

After my W3C TPAC breakout session focused on Project Fugu last year, this year, too, I ran a breakout session titled "Learning from Mini Apps" at the fully virtual TPAC 2020 event. In this breakout session, I first explained what mini apps are and how to build them, and then moved on to an open discussion focused on what Web developers can learn from mini apps and their developer experience. The TPAC folks have done an ace (👏) job and have put all the resources from my session online (and everyone else's of course):

• The 📹 talk recording if you fancy watching the whole talk.
• The 📄 written transcript if you prefer reading over watching.
• My 🖼 presentation slides are online, and also embedded below.
• The 💬 meeting minutes if you want to catch up on the side channel conversations on IRC.

General event recap ⚓

For being a first-time virtual event, communication went really well. It felt like everyone has learned by now how to discuss in virtual rooms, and Zoom as the communication platform held up well. While I appreciate the W3C team having made an effort to replace hallway conversations, I didn't attend any of these slots. It just felt exhausting to do those on top of 11pm meetings or 7am slots, apart from the "just fine" afternoon slots (the "golden hour" is actually super friendly for people in the EU), but time zones are hard.

This post appeared first on https://blog.tomayac.com/2020/11/05/learning-from-mini-apps-w3c-tpac-breakout-session/.

I have landed an article over on web.dev that talks about the Gamepad API. One piece of information from this article that our editorial board was not comfortable with having in there was instructions on how to play the Chrome dino game on a Nintendo Switch. So, here you go with the steps right here on my private blog instead.

The Nintendo Switch contains a hidden browser, which serves for logging in to Wi-Fi networks behind a captive portal. The browser is pretty barebones and does not have a URL bar, but, once you have navigated to a page, it is fully usable. When doing a connection test in system settings, the Switch will detect that the captive portal is present and display an error for it when the response for http://conntest.nintendowifi.net/ does not include the X-Organization: Nintendo HTTP header. I can make creative use of this by pointing the Switch to a DNS server that simulates a captive portal that then redirects to a search engine.

1. Go to System Settings and then Internet Settings and find the Wi-Fi network that your Switch is connected to. Tap Change Settings.
2. Find the section with the DNS Settings and add 45.55.142.122 as a new Primary DNS. Note that this DNS server is not operated by me but a third-party, so proceed at your own risk.
3. Save the settings and then tap Connect to This Network.
4. The Switch will tell you that Registration is required to use this network. Tap Next.
5. On the page that opens, make your way to Google.
6. Search for "chrome dino tomayac". This should lead you to https://github.com/tomayac/chrome-dino-gamepad.
7. On the right-hand side in the About section, find the link to https://tomayac.github.io/chrome-dino-gamepad/. Enjoy!
8. 🚨 For regular Switch online services to work again, turn your DNS settings back to Automatic. Conveniently, the Switch remembers previous manual DNS settings, so you can easily toggle between Automatic and Manual.

For the Chrome dino gamepad demo to work, I have ripped out the Chrome dino game from the core Chromium project (updating an earlier effort by Arnelle Ballane), placed it on a standalone site, extended the existing gamepad API implementation by adding ducking and vibration effects, created a full screen mode, and Mehul Satardekar contributed a dark mode implementation. Happy gaming!

You can also play Chrome dino with your gamepad on this very site. The source code is available on GitHub. Check out the gamepad polling implementation in trex-runner.js and note how it is emulating key presses.

This post appeared first on https://blog.tomayac.com/2020/11/04/play-the-chrome-dino-game-on-your-nintendo-switch/.