Skip to main content

Unity Game (WebGL) as a Firefox Extension

Firefox is known for its' extensions. That's in fact one of the main reasons people still use it. They had to take a bunch of bold steps in the recent times to stay relavant, like ending support for older extensions, changing the security model and the api.

Firefox  announced a new contest for addons, The Firefox Quantum Extensions challenge. I thought ill' give it a shot. I quickly looked up the documentation for creating an extension and looked pretty simple, there was this game for 2048 i was super excited to put games as extension, quick access short games might workout  i thought.. I wanted to check if i could use my existing game dev tools to create an extension.. hence Unity for FF Extension.

I quickly exported unity game as WebGL and tried loading it as an extension. I ran into issues with something called CSP i don't remember seeing it before but here it was preventing me from loading the unity webgl game as firefox extension. After a bunch of mucking around and not finding any straightforward answer i was able to get it working here it is for anybody else who might be looking for the same.

Three important parts for this (Get the starter code from GitHub)
  • Move the inline script from index.html to a separate file
  • Create a background script for FF addon that will open a new window through "BrowserAction"
  • Allow "blob:" support in the  security policy through manifest.json

Modify the index.html exported by UnityWebGL
The inline script is moved to a separate file called game_loader.js
 
The next thing to do is to add the right security policy to the manifest.json so that the unity loader can load the script blob.



The background script popuptest.js should be handling the browser action click event to launch a new window and load the games' index.html

With these things done, you should be able to load a unity game exported as webgl should be usable as a firefox extension.

Comments

Popular posts from this blog

Epic Games Store on Steam Deck

EGS ( Epic Games Store ) like it or hate it, has been giving away free games and if you like free games you would have picked up atleast a couple of them. So given that some of those games are Deck Verified / Playable, its fair to assume you would like to install the EGS on the Deck.  Installing EGS on Steam Deck Switch to Desktop Mode on your Steam Deck Download the EGS installer for windows from the Epic Store website: https://store.epicgames.com/en-US/download (using your web browser of choice)      Open Steam in the desktop mode and add the installer as a non-steam game                                In the browse window, switch from .desktop files to All files. Select EpicInstaller-xxx.msi and add it to steam library. Find EpicInstaller in your steam library and open its' properties by hitting the "Gear" icon on the right ...

Flash animations in GoDot Engine

If you have not heard about GoDot game engine,.. you should check it out right away.. godotengine.org Last time, i wrote a blog post about my experience making a simple physics game to GoDot Engine. Though there are a bunch of free options announced during the GDC this year, i thought ill' contribute to the engine. The one piece that is most important for game dev is the pipeline for the engine. One of the most common tools used for 2D animations is Flash. I have been using a library called Super Animation for almost all the games we've made for android at TMG. It's  a  free tool which lets you convert swf files to .sam files. This file can then be loaded in Cocos2Dx using the Open source loader library  https://github.com/raymondlu/super-animation-samples I thought it would be a good idea to port this cpp library to GoDot so that i understand how to write custom modules for the engine. This is the video of the module in action. I have expos...

Vehicle Physics (Godot 2D)

I've always been fascinated with the vehicle physics used in games. I played so many racing games / the hill climb games and every single time i would wonder wow that must be really hard to do. Thanks to the new generation of game development tools, developing physics based games has become almost a second nature to most people. I didn't want to be left out so i gave it a shot.. I tried setting up vehicle physics in GoDot Engine for a 2D vehicle. Here is what the vehicle scene looks like.. 2D vehicle setup in GoDot As you can see the body collision shape is not right but the rest of the stuff just works. The idea is simple think of what parts move along with the body vs what doesn't. I was kinda stuck setting up the pinJoint2D in GoDot, it actually clearly takes two nodes under the properties. This makes sure that the wheels are hinged to the DampingSpring2D. The Damping Spring2D takes two physics bodies(Body and the PinJoint2D) and makes it work like shock ab...