Local Development Server

With Pulsar you can run/debug your HTML/Javascript code from a local server running on your own development machine. This productivity feature allows you to bypass the time-consuming process of uploading a new .pulsarapp bundle to Salesforce servers and resyncing the Pulsar app.

Salesforce Org Setup

• pulsar.developer.enableDevelopmentServer – Pulsar Setting must be set to TRUE

• pulsar.developer.users{.DocId} – List of developer usernames (e.g., you@yourorg), separated by comma, semicolon, or newlines for a specific document.  Note that {.DocId} can be empty, in which case this is an org-global list of developers (for all documents!)

• We recommend that you only have these setup for your testing orgs, and never for your production orgs!

Local Development Setup

Video - Windows Local Development

Video - Android Local Development

Serving your code

You can serve your code to the Pulsar app via an HTTP server running on your development machine. One option is to use http-party/http-server to serve the contents of a directory, or if you are building a React or Angular app to run within Pulsar, these frameworks already have their own way to run an HTTP server.

NOTE: You must use relative paths for all resources you wish to serve from your development server-- this includes stylesheets, javascript files, images, and anything referenced in your code that does not exist inside of Pulsar. For example, use this: <script src='static/js/mycode.js' /> and not this: <script src='/static/js/mycode.js' />

Android Local Development Setup

• Your local HTTP server must be running on localhost (127.0.0.1) port 3002 of your development machine.

• Your Android device must have Developer Options enabled and ADB debugging enabled. And of course you must be connected to your device over ADB either via Wifi or USB cable.

• Set up reverse port forwarding from your development machine: adb reverse tcp:3002 tcp:3002

• Note that the ADB client/server can sometimes gets disconnected (and the reverse rule purged).  You will need to recreate the rule after re/connection to the device. You can double-check that you have reverse port-forwarding of 3002 in place: adb reverse --list

Windows Local Development Setup

• Your local HTTP server must be running on your development machine

• New in Pulsar version 12, you can connect to a local development server running on your Wifi – you aren’t restricted to just localhost (127.0.0.1) port 3002 like for Android development. Just type the appropriate ipaddr:port configuration into the configuration block on the Settings page.

• NOTE that you can also still connect to a local development server running on localhost (127.0.0.1) port 3002. In this case you will also need to ensure that the Pulsar app has loopback exemption on your Windows machine:

  • Via a PowerShell or CMD shell prompt, run CheckNetIsolation.exe LoopbackExempt -a -n="E3D1A000.PulsarforSalesforce_ta6n8xy84gcpg" – You should only need to do this step once, per installation of Pulsar, per machine.

  • Now verify that Pulsar is showing in the exemption list: CheckNetIsolation.exe LoopbackExempt -s

iOS Local Development Setup

• Your local HTTP server must be running on your development machine

• From the configuration block on the Settings Page, you must configure an ipaddr:port from the configuration block on the Settings Page

• NOTE that if your development machine is a Mac with Apple silicon (not Intel) you can download Pulsar from the App Store and run and do all your testing there

Pulsar App Setup

• Login to Pulsar and make sure your organization is fully synced at least once, including your Content Library documents.

• From the Settings page, advanced section, toggle the development server on, and change the ipaddr:port as needed

  • If you do not see the toggle, then it is likely that your org is not configured correctly for development mode (for your specific username) – you might need to Refresh Settings if you just added your account to the developers list.

• Note that once the development server toggle is on, it is sticky per-session.  You will need to re-toggle it if you logout of the session and/or restart the Pulsar app.

   

Open On iOS, you must configure an ipaddr:port	Open On Windows, you can change ipaddr:port

Web Development Flow in Pulsar

• In the Pulsar app, Find the the specific HTML/.pulsarapp document (in your Content Library) you want to debug and download/open it

  • With development server OFF, of course Pulsar will load the document/bundle that is synced from your org (the org version)

  • With development server ON, Pulsar loads from the ipaddr:port specified (on Android this is always 127.0.0.1:3002 forwarded over ADB)

• If you make a change to your HTML/JS code being served by your local development server, simply hit the page refresh button in Pulsar to reload

Debugging your Javascript running in Pulsar

Debugging on Android

On Android, by design, Google fully restricts access to embedded WebViews running in released apps. What this means is that you cannot attach a debugger to the Pulsar app to debug your Javascript.

Fortunately, you can turn on WebView Javascript console logging to the Android logcat to perform log (printf)-style debugging. On your Android emulator or device, (which you already should have in developer mode with USB debugging enabled), you need to launch the Android WebView DevTools and enable the webview-log-js-console-messages flag. Once enabled, all Javascript console logging will be sent to the Android logcat. Among other tools, you can use the ADB CLI to view the logcat.

Debugging on iOS

On iOS, by design, Apple fully restricts access to embedded WebViews running in released apps. What this means is that you cannot attach a debugger to the Pulsar app to debug your Javascript.

Debugging on Windows

• If you prefer debugging with log statements, you have direct access to the Pulsar logs at the following location on disk: C:\Users\<YourUserName>\AppData\Local\Packages\E3D1A000.PulsarforSalesforce_ta6n8xy84gcpg\LocalState\Library\Application Support\log.txt

• On Windows Pulsar versions before 11.0.0.0 , you can fully debug your Javascript running in Pulsar by using the Edge Developer Tools. Video link: Video - Debugging on Windows

• New for Windows Pulsar versions 11.0.0.0+ - use Edge Browser Developer Tools: With Pulsar version 11 on Windows, you should debug your code using the built-in Edge browser developer tools, which will be available for any user/document combination authorized for local development server use (via pulsar.developer.users setting). The older Edge Developer Tools preview application will no longer work with Pulsar. To use the built-in Developer Tools with Pulsar, be sure to enable remote debugging (click to see Microsoft documentation). In summary :

  • Before you start:

    • Ensure your Salesforce user is added to the pulsar.developer.users Pulsar Setting in the org where you will be debugging.

    • Ensure that Pulsar has loaded the content you wish to debug.

  • Enable Developer Mode: Open Windows Settings, select Privacy & security > For developers, and then turn on the Developer Mode toggle.

  • In the same Settings page, turn on the Device Portal toggle (follow prompts to install developer packages if necessary).

  • After the installation is complete, note the Device Portal URL that will be used for the remote debugging connection. To find this URL, expand the Device Portal dropdown on the same Settings page, and a list or URLs will appear. Choose the local URL, for example, http://localhost:50080.

  • Install Remote Tools for Microsoft Edge from the Microsoft Store. Note that it is not necessary to open the application.

  • In the Edge browser, navigate to the following URL: edge://inspect.

  • In the Connect to a remote Windows device text box, enter http://<Device Portal URL> (the url from the step above), such as http://localhost:50080, and then click Connect to Device.

    • TIP: if nothing appears to happen, try opening another browser tab and navigating to http://localhost:50080 on that tab. Then come back to your edge://inspect tab and Connect to a remote Windows device again.

  • Verify that you can successfully connect, and a section named Edge is listed. Click inspect to load the DevTools window and debug your content: