6.3 KiB
TimeSafari.app - Crowd-Funder for Time - PWA
Project setup
We have pkgx.dev set up in package.json, so you can use dev
to set up the dev environment.
npm install
Compiles and hot-reloads for development
npm run serve
Lints and fixes files
npm run lint
Compiles and minifies for production
-
Update the project.task.yaml & CHANGELOG.md & the version in package.json, run
npm install
, and commit.
... though maybe you do that after testing and release, since that isn't used in the build (and you often increment a lot during testing).
-
If production, change src/constants/app.ts DEFAULT_*_SERVER to be "PROD" and package.json to remove "_Test". Also record what version is on production.
-
npm run build
-
npx prettier --write ./sw_scripts/
...to make sure the service worker scripts are in proper form. (It's only important if you changed something in that directory.)
cp sw_scripts/[ns]* dist/
... to copy the contents of the sw_scripts
folder to the dist
folder - except additional_scripts.js.
-
Get on the server and back up the time-safari folder.
-
rsync -azvu -e "ssh -i ~/.ssh/..." dist ubuntutest@test.timesafari.app:time-safari
-
Revert src/constants/app.ts and package.json (if that was prod), edit package.json to increment version & add "-beta",
npm install
, and commit. Tag if you didn't before. Also record what version is on production.
Tests
Register new user on test server
On the test server, User #0 has rights to register others, so you can start
playing by importing that user and registering others. Import the keys for the test User
did:ethr:0x0000694B58C2cC69658993A90D3840C560f2F51F
by importing this seed phrase:
rigid shrug mobile smart veteran half all pond toilet brave review universe ship congress found yard skate elite apology jar uniform subway slender luggage
(Other test users are found here.)
Create multiple identifiers
Under the "Your Identity" screen, click "Advanced", click "Switch Identity / No Identity", then "Add Another Identity...".
Create keys with alternate tools
This page is a tool to create a JWT from a locally-generated keypair.
Web-push
For your own web-push tests, change the push server URL in Advanced settings on the account page, and install Time Safari & push server on the same domain.
Icons
To add an icon, add to main.ts and reference with fa
element and icon
attribute with the hyphenated name.
Manual walk-through
- Clear the browser cache for localhost for a new user.
- See that it's using the test API.
- On each page, verify the messaging.
- On the home page, see the feed without names, and see a message prompting to generate an ID.
- On the discovery page, check that they can see projects, and set a search area to see projects nearby.
- As User #0 in another browser on the test API, add a give & a project. (See User #0 details above.)
- With the new user on the home page, see the feed that shows User #0 in network but without the name.
- As the new user on the contacts page, add User #0 as a contact.
- On the home page, see the feed that shows User #0 with a name.
- Generate an ID.
- On the home page, check that it now prompts them to get registered.
- On the account page, check that they see messages on limits.
- Register the ID from User #0.
- As the new user on the home page, check that they can now record a gift.
- On the contacts page, check that they cannot register someone else yet.
- Walk through the functions on each page.
Scenarios
-
Create a new identity as prompted. Go to "Your Identity" screen and copy the ID to the clipboard.
-
Go back to /start and import test User #0
did:ethr:0x0000694B58C2cC69658993A90D3840C560f2F51F
with this this seed phrase:rigid shrug mobile smart veteran half all pond toilet brave review universe ship congress found yard skate elite apology jar uniform subway slender luggage
(Other test users are found here.) -
Go to "Your Contacts" screen and add the ID you copied to the clipboard, and hit "+" to add them.
-
Click on the "Registration Unknown" button and register that person to be able to make claims as them.
Clear/Reset data & restart
- Clear cache for site. (In Chrome, go to
chrome://settings/cookies
and "all site data and permissions"; in Firefox, go toabout:preferences
and search for "cache" then "Manage Data", and also manually remove the IndexedDB data if the DBs still show.) - Clear notification permission. (In Chrome, go to
chrome://settings/content/notifications
; in Firefox, go toabout:preferences
and search for "notifications".) - Unregister service worker. (In Chrome, go to
chrome://serviceworker-internals/
; in Firefox, go toabout:serviceworkers
.) - Clear Cache Storage manually, possibly deleting the DB. (In Chrome, in dev tools under Application; in Firefox, in dev tools under Storage.)
(If you find more, add them to the HelpNotificationsView.vue file.)
Other
Reference Material
-
Notifications can be type of
toast
(self-dismiss),info
,success
,warning
, anddanger
. They are done via notiwind and set up in App.vue. -
If you are deploying in a subdirectory, add it to
publicPath
in vue.config.js, eg:publicPath: "/app/time-tracker/",
Kudos
Gifts make the world go 'round!
- Máximo Fernández for the 3D code and explanatory post
- Many tools & libraries such as Nodejs.org, IntelliJ Idea, Veramo.io, Vuejs.org, threejs.org
- Bush 3D model
- Forest floor image
- Time Safari logo assisted by DALL-E in ChatGPT