• Stars
    star
    270
  • Rank 147,123 (Top 3 %)
  • Language
    JavaScript
  • License
    BSD 3-Clause "New...
  • Created over 5 years ago
  • Updated about 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Scratch 3.0 as a self-contained desktop application

scratch-desktop

Scratch 3.0 as a standalone desktop application

Developer Instructions

Releasing a new version

Let's assume that you want to make a new release, version 3.999.0, corresponding to scratch-gui version 0.1.0-prerelease.20yymmdd.

  1. Merge scratch-gui:
    1. cd scratch-gui
    2. git pull --all --tags
    3. git checkout scratch-desktop
    4. git merge 0.1.0-prerelease.20yymmdd
    5. Resolve conflicts if necessary
    6. git tag scratch-desktop-v3.999.0
    7. git push
    8. git push --tags
  2. Prep scratch-desktop:
    1. cd scratch-desktop
    2. git pull --all --tags
    3. git checkout develop
    4. npm install --save-dev 'scratch-gui@github:LLK/scratch-gui#scratch-desktop-v3.999.0'
    5. git add package.json package-lock.json
    6. Make sure the app works, the diffs look reasonable, etc.
    7. git commit -m "bump scratch-gui to scratch-desktop-v3.999.0"
    8. npm version 3.999.0
    9. git push
    10. git push --tags
  3. Wait for the CI build and collect the release from the build artifacts

A note about scratch-gui

Eventually, the scratch-desktop branch of the Scratch GUI repository will be merged with that repository's main development line. For now, though, the scratch-desktop branch holds a few changes that are necessary for the Scratch app to function correctly but are not yet merged into the main development branch. If you only intend to build or work on the scratch-desktop repository then you can ignore this, but if you intend to work on scratch-gui as well, make sure you use the scratch-desktop branch there.

Previously it was necessary to explicitly build scratch-gui before building scratch-desktop. This is no longer necessary and the related build scripts, such as build-gui, have been removed.

Prepare media library assets

In the scratch-desktop directory, run npm run fetch. Re-run this any time you update scratch-gui or make any other changes which might affect the media libraries.

Run in development mode

npm start

Make a packaged build

npm run dist

Node that on macOS this will require installing various certificates.

Signing the NSIS installer (Windows, non-store)

This section is relevant only to members of the Scratch Team.

By default all Windows installers are unsigned. An APPX package for the Microsoft Store shouldn't be signed: it will be signed automatically as part of the store submission process. On the other hand, the non-Store NSIS installer should be signed.

To generate a signed NSIS installer:

  1. Acquire our latest digital signing certificate and save it on your computer as a p12 file.
  2. Set WIN_CSC_LINK to the path to your certificate file. For maximum compatibility I use forward slashes.
    • CMD: set WIN_CSC_LINK=C:/Users/You/Somewhere/Certificate.p12
    • PowerShell: $env:WIN_CSC_LINK = "C:/Users/You/Somewhere/Certificate.p12"
  3. Set WIN_CSC_KEY_PASSWORD to the password string associated with your P12 file.
    • CMD: set WIN_CSC_KEY_PASSWORD=superSecret
    • PowerShell: $env:WIN_CSC_KEY_PASSWORD = "superSecret"
  4. Build the NSIS installer only: building the APPX installer will fail if these environment variables are set.
    • npm run dist -- -w nsis

Workaround for code signing issue in macOS

Sometimes the macOS build process will result in a build which crashes on startup. If this happens, check in Console for an entry similar to this:

failed to parse entitlements for Scratch[12345]: OSUnserializeXML: syntax error near line 1

This appears to be an issue with codesign itself. Rebooting your computer and trying to build again might help. Yes, really.

See this issue for more detail: electron/osx-sign#218

Make a semi-packaged build

This will simulate a packaged build without actually packaging it: instead the files will be copied to a subdirectory of dist.

npm run dist:dir

Debugging

You can debug the renderer process by opening the Chromium development console. This should be the same keyboard shortcut as Chrome on your platform. This won't work on a packaged build.

You can debug the main process the same way as any Node.js process. I like to use Visual Studio Code with a configuration like this:

    "launch": {
        "version": "0.2.0",
        "configurations": [
            {
                "name": "Desktop",
                "type": "node",
                "request": "launch",
                "cwd": "${workspaceFolder:scratch-desktop}",
                "runtimeExecutable": "npm",
                "autoAttachChildProcesses": true,
                "runtimeArgs": ["start", "--"],
                "protocol": "inspector",
                "skipFiles": [
                    // it seems like skipFiles only reliably works with 1 entry :(
                    //"<node_internals>/**",
                    "${workspaceFolder:scratch-desktop}/node_modules/electron/dist/resources/*.asar/**"
                ],
                "sourceMaps": true,
                "timeout": 30000,
                "outputCapture": "std"
            }
        ]
    },

Resetting the Telemetry System

This application includes a telemetry system which is only active if the user opts in. When testing this system, it's sometimes helpful to reset it by deleting the telemetry.json file.

The location of this file depends on your operating system and whether or not you're running a packaged build. Running from npm start or equivalent is a non-packaged build.

In addition, macOS may store the file in one of two places depending on the OS version and a few other variables. If in doubt, I recommend removing both.

  • Windows, packaged build: %APPDATA%\Scratch\telemetry.json
  • Windows, non-packaged: %APPDATA%\Electron\telemetry.json
  • macOS, packaged build: ~/Library/Application Support/Scratch/telemetry.json or ~/Library/Containers/edu.mit.scratch.scratch-desktop/Data/Library/Application Support/Scratch/telemetry.json
  • macOS, non-packaged build: ~/Library/Application Support/Electron/telemetry.json or ~/Library/Containers/edu.mit.scratch.scratch-desktop/Data/Library/Application Support/Electron/telemetry.json

Deleting this file will:

  • Remove any pending telemetry packets
  • Reset the opt in/out state: the app should display the opt in/out modal on next launch
  • Remove the random client UUID: the app will generate a new one on next launch

More Repositories

1

scratch-gui

Graphical User Interface for creating and running Scratch 3.0 projects.
JavaScript
4,239
star
2

scratch-blocks

Scratch Blocks is a library for building creative computing interfaces.
JavaScript
2,534
star
3

scratch-www

Standalone web client for Scratch
JavaScript
1,507
star
4

scratch-flash

Open source version of the Scratch 2.0 project editor. This is the basis for the online and offline versions of Scratch found on the website.
ActionScript
1,326
star
5

scratch-vm

Virtual Machine used to represent, run, and maintain the state of programs for Scratch 3.0
JavaScript
1,165
star
6

scratchjr

With ScratchJr, young children (ages 5-7) can program their own interactive stories and games.
JavaScript
662
star
7

scratch-html5

HTML 5 based Scratch project player
JavaScript
390
star
8

scratch-render

WebGL-based rendering engine for Scratch 3.0
JavaScript
254
star
9

scratchx

Scratch Extension Site
JavaScript
190
star
10

scratch-paint

Paint editor for Scratch 3.0
JavaScript
165
star
11

Scratch_1.4

Source Code repository for Scratch 1.4
C
107
star
12

scratch-link

Device interoperability layer for Windows and MacOS
C#
89
star
13

scratch-l10n

JavaScript
62
star
14

scratch-parser

Validation and parsing for Scratch projects
JavaScript
57
star
15

scratch-audio

Web Audio-based audio engine for Scratch 3.0
JavaScript
54
star
16

scratch-storage

Load and store project and asset files for Scratch 3.0
JavaScript
54
star
17

scratch-rest-api

Documentation for how to interact with the Scratch REST API
53
star
18

scratchjr-website

Code for the Scratch Jr Website
JavaScript
46
star
19

scratch-svg-renderer

Scratch SVG renderer
JavaScript
31
star
20

scratch-analysis

Analysis tool for summarizing the structure, composition, and complexity of Scratch programs.
JavaScript
24
star
21

scratch-extension-docs

[Deprecated] Sample code for Scratch 2.0 hardware and web extensions.
22
star
22

scratchr2_translations

Translations for the Scratch 2.0 website
16
star
23

scratchwikiskin

Skin for the Scratch wiki
PHP
15
star
24

scratch-resources

Source files and images for translators to translate Scratch materials
JavaScript
14
star
25

scratch-render-fonts

Fonts for Scratch SVG rendering
JavaScript
13
star
26

po2icu

An npm package for converting gettext to icu.
JavaScript
11
star
27

scratch-sb1-converter

Convert Scratch .sb files (for Scratch 1) to Scratch 2 (.sb2) in JS.
JavaScript
11
star
28

scratch-auth

Authentication utilities for Scratch
JavaScript
11
star
29

eslint-config-scratch

Shareable ESLint config for Scratch
JavaScript
8
star
30

scratch-docker

Scratch docker infrastructure npm module
Shell
7
star
31

scratch2-project-analyzer

Tools for analyzing Scratch 2.0 projects
Python
6
star
32

scratch-asset-types

Supported asset detection and types for Scratch backend
JavaScript
6
star
33

django-request-provider

Python
5
star
34

scratchx-example

Examples for working with Scratch and ScratchX extensions
JavaScript
5
star
35

swiki-navbar

A small extension for the Scratch Wiki that creates a limited navigation bar for users who are not logged in
PHP
4
star
36

scratchx-crossdomain

Standard crossdomain.xml file for use with ScratchX
4
star
37

.github

Scratch community health files
2
star
38

scratch-renovate-config

Scratch's shared configuration for Renovate
1
star