Access SAP Business Application Studio as a remote from Visual Studio Code

[geert-janklaps]

I've been using SAP Business Application Studio for quite some time now and I'm really a big fan! No more hassling around with local setups, dependencies, plugins, ... this really simplified my life as a developer.

I'm using quite some different computers so, having your developer environment available anywhere anytime out-of-the-box is just a dream come true.

There was however one small annoyance, working in a web browser. As a developer I tend to have quite some open tabs & windows for documentation purposes. In one of my tabs I have Business Application Studio running, but quickly switching between tabs / windows didn't feel right. It always felt like I had to search through all my open tabs and windows to find my Business Application Studio tab again.

I was very pleased to see this being addressed by this roadmap item.

SAP Business Application Studio remote development extension

 

Well here's some great news! It's now possible to access Business Application Studio workspaces directly from your local Visual Studio Code installation!

Setting up remote access to Business Application Studio

In your local Visual Studio Code installation, navigate to extensions and look for "SAP Business Application Studio toolkit". Install the extension with the "Install" button.

Install Business Application Studio Toolkit extension

Once the installation is finished, you'll find a new activated extension in the sidebar for "Business Application Studio Desktop Client". Open the extension and click the "Connect your landscape" button.

Connecting to your SAP Business Application Studio landscape

Visual Studio Code will ask for your Business Application Studio landscape URL. Enter the URL to your landscape (which you can find in the SAP BTP Cockpit) and press enter.

Entering your SAP Business Application Studio landscape URL

Once the landscape is added, you can login to your landscape by clicking the login button. A browser window will be opened to provide your credentials.

Logging into your SAP Business Application Studio landscape

Once you're logged in, you'll see a list of your dev spaces. In this list you can start / stop dev spaces by clicking the buttons next to the dev space.

Starting your dev space

After starting your dev space, you'll see a new button has appeared which you can use to open up your dev space.

Connecting to your dev space

And it's as easy as that! You're now working directly in your remote dev space! (you'll see the dev space you're connected to in the lower left corner, marked in green)

Start working in your dev space from Visual Studio Code!

Wrap-up

For me personally this is game changer, I'm really happy to be able to use my local Visual Studio Code installation to connect to SAP Business Application Studio! Installation of the SAP Business Application toolkit is straight forward and there's a minimal amount of configuration needed to get you started!

Big thanks to the SAP Business Application Studio team to add this feature to the toolset!

[vobu]

this could indeed facilitate dev env onboarding tremendously! If you can…

- sync extensions both ways: BAS to local and vice versa?

- use the BTP destinations from vscode like you can in BAS?

Eager to know 🙂

[geert-janklaps]

The answer to both questions is yes 🙂

You're connecting to a container running BAS (based on VS Code) in the cloud. Which basically holds its own extensions etc.

Same goes for the terminal, you're really working inside that container, so your terminal is also connected to that container.

Let me prove that to you 🙂

On the left my local VS Code installation (without any extensions, except for the default ones and that BAS toolkit). On the right my dev space through VS Code, with all its extensions loaded properly. If I try to install additional extensions, you'll see that they will get installed into the BAS container.

On the right a curl command to a destination on BTP, returning the service document of an OData service.

[vobu]

waaaah, now finally being able to use the same destinations locally as on BAS. that‘s a major improvement for dev time!!! (and might make scp-cf-proxy obsolete 😢 gregorw joachim.vanpraet

let's see if we can also use all'em BTP services from the local vscode BAS extension!

[wridgeu]

A dream come true! I've also been struggling with the exact same problem you're describing at the start. 😄

I wasn't aware of this plugin or roadmap item so I highly appreciate this blog post and I will give this a try asap. I'm stoked. 😃

[Cocquerel]

I'm getting the following error message (see screenshot)

After reloading the windows, the error comes back again and again.

Looking at my extensions, the one mentioned into the error is correctly installed.

Any idea what is the issue ?

[ido_perez]

Hi Michael,

This is a known issue. We are working on a fix, and will deploy it soon.

 

Thanks,

Ido

[jhodel18]

For me I'm getting this error after logging in:

I can see that I'm logged in in my landscape but no dev spaces underneath it.

Thanks and regards,

Jhodel

[Martin-Pankraz]

And finally BAS became reachable for GitHub Codespaces and Copilot 😍 8d8214c7f9734f45be69f95cc0d5aeee vobu ido.perez marcobeier have you tried yet?

Makes sense to require "cf ssh" to reach BTP connectivity services still. Advancements in SAP Private Link (reverse direction - reaching from Azure into BTP) and Azure VNet injection of the Codespace might change that going forward.

KR

Martin

[Martin-Pankraz]

Find the "Azure VNet injection of the Codespace" reference here.

[ido_perez]

Hi Cailan,

It is a known issue. A fix is coming very soon.

 

Thanks,

Ido

[ivo_skolek]

Hello, great stuff, thank you for sharing! When trying to preview application (while in VS Code connected to BAS) I get just screen as per screenshot. When previewing the same from BAS it works fine. Any extra config required to preview apps?

[jhodel18]

Hi ido.perez

Aside from the issue above, I found out that the BAS extension is quite intrusive i.e. (1) automatically created VSCode settings file for projects I don't even use this extension, and (2) removed my VSCode welcome page.

While the idea of making a BAS extension for VSCode sounds cool, can you please tone down on the intrusiveness of this extension? Like don't take over the global settings, but instead keep the settings local to this extension only?

Thanks and regards,

Jhodel

[nsathya_infy]

Github Copilot on BAS is truly a Game changer.

[nsathya_infy]

It works when you click the option "Open in a New Tab" as per the port opened in the Terminal and not the "Open in Browser". Or refreshing the preview open in BAS will also work.

[nicorunge]

Hi ido.perez

since today the message has disappeared and I tested again. But now I run into the next problem. CDS is not found and therefore I cannot start any application. In BAS the application can be started as usual.

I have no CDS installed on my local machine, but from my understanding this is not needed for as everything runs on the remote BAS session?!

best regards

Nico

[DenisGaland]

That sounds a great feature!

 

For the moment, I can't login

And it gets me this message in my browser

Any idea?

[ido_perez]

Hi,

 

You are using your CF API endpoint and not the BAS subaccount URL. You can copy it from your Business Application Studio dev-space manager environment URL

[ido_perez]

Hi jhodel18 ,

Thanks for your feedback. We identified the issue with the settings, and will fix in a next release.

Can you explain the removal of the VSCode welcome page?

 

Thanks,

Ido

[rima-sirich]

Hi nicorunge

Thanks for reporting this issue. We are currently working on a fix for it. Will notify you once it is available.

Regards,

Rima

[jhodel18]

Hi Ido,

I found out that the extension added an entry to my global settings.json:

{

  "workbench.startupEditor": "none"

}

which resulted in suppressing the welcome page at the initial load of the IDE.

 

 

[ido_perez]

Hi Sorry for that!

We will fix it in the next version. For now, you can remove this from the global settings.

 

[jhodel18]

It's alright. Looking forward to the next release!

[archit_goel]

Even after successfully logging in via the browser, the plugin doesn't load. I see this error in the output:

{

"label": "app-studio-toolkit",

"level": "error",

"message": "Error: Login time out in 60000 ms.",

"time": "2023-05-11T13:42:28.124Z"

}

{

"label": "app-studio-toolkit",

"level": "error",

"message": "Personal Access Token is required",

"time": "2023-05-11T13:42:28.126Z"

}

[ruben_alvarez]

Hi,

VSC connected to BAS but curl command to destination on BTP isn't working.

 

Any idea?

 

Thanks in advance.

 

 

[DenisGaland]

Same here, curl doesn't work in vscode and works well in BAS itself

 

[Jeff]

I had this same problem.  Is your default browser Safari by chance?  Mine was.  I changed it to Chrome and logged into BAS from VSC again and it worked fine.

[archit_goel]

Yes it is. Let me try that. Thanks!

 

[vvdries]

Hi rima.rudnik-sirich

I was wondering if the fix for this issue has been released already, since I'm still experiencing it as well.

Thank you in advance!

Best regards,

Dries

[rima-sirich]

Hi vvdries

I am happy to update you that the fix for this issue was deployed to productive landscapes yesterday evening.

Regards,

Rima

[vvdries]

Hi rima.rudnik-sirich

Thank you for the update and fix, I just gave it a try and it runs smooth again!

Best regards,

Dries

[nicorunge]

Hi rima.rudnik-sirich,

what I find quite confusing after working about two days using local VSC, that whenever the Dev Space is automatically stopped (when not used for a while because the pc went to sleep) you are not informed, and sometimes you start to write code and after a few minutes you suddenly get the message that it's disconnected and unable to save. Also, you cannot reconnect. Even when starting the dev space again, it is stuck on "Opening Remote..." forever. You have to close the window and have to click "Open in new window" again, and you also have to choose your current project folder every time again.

BR, Nico

[DimoUzunov]

That's a deal breaker! Thank you!

[anita_dixit]

Hi,

I added the landscape link in BAS desktop client : Dev Space, and tried to login. It is not opening at all. But in the browser, I got it logged in successfully.

Another try, from BAS on browser, I ran this command "SAP Business Application Studio: open dev space in VS code", I get this error "Can't open the devspace: Unable to parse decrypted password".

Kindly provide a solution.

[sapRSH]

Hello,

I am also trying to connect to my Dev space (BAS Trial Version) in VS Code but get the following error : "Could not authenticate to landscape"

Not sure what's the issue. I am able to connect to my Dev Space on browser just fine.

Is there any limitation of connecting BAS Trial Version to VS Code?

 

Regards,

Ravi

 

[sapRSH]

Well, I just realized there was a small button showing in VS Code at the end of URL to login. Issue resolved. Never mind 🙂

[Mattias]

Same here, CURL does not work, so my Fiori apps also does not work.


Error: getaddrinfo ENOTFOUND virtualsngtest.domain.com


Otherwise exciting work!

[cristiano_santos]

Does this extension supports Layout Editor available in BAS?

[former_member618235]

UI Card Preview function, an error occurs as shown below and the function does not work.

How can I use UI Card Preview?

[Attila]

Hello techies,

similar connection issues here.

Dev pace on BTP was autostopped after inactivity, then VScode shows this despite the dev space was started again:

 

Nothing else, but this helped only:

 

[Attila]

Hi SAP Tool Development,

do we have a channel on https://influence.sap.com to submit request for this feature ?

I'd like to have an option to copy the Logon URL, instead of opening the default browser where I'm already authenticated with a different user on BTP, not the one used for development, which is running in a different browser/session.

We have in ABAP Development Tools the possibility to copy the Log on URL and paste it in a  different browser, when we do not want the default browser to open for ABAP Cloud authentication. I'd like to have this option in VSCode as well.

In the SAP HANA Projects Tooling this is a blocker. I am trying to open the HDI container, and get this error

Thank You

Best regards, Attila

[SudarshanS]

Hi team, on my laptop, am getting the error "Failed to get dev spaces, Error: certificate has expired". Please can you advise what certificate this is referring to?

 

Thanks

Sudarshan

[pvonbehren1]

@Nicolas this is really a problem. I run into the timeout 2-3 times the day, this makes it hardly possible to work meaningfully with the local vsc ide.

Has anyone found a workaround for this ?

[ABAP-Pete25]

Hi everyone,

I tried to execute the steps described here and it failed after logon.
I have used following link to connect local VSCode to my BAS on the BTP trial account:

link used in VS Code BAS extension

It opens the logon Page which states that I am successfully logged in.
But then in VS Code I get following error message and dev spaces are not visible in VS Code:

Error after logon BAS

In VS Code I set proxy settings similar as I do in eclipse to avoid firewall issues.

Does anyone has some hints what I can do to make it work and where possible issues could create this behaviour?

Thank you very much.

PS: I am an ABAP'er and very used to ADT in Eclipse, VS Code and BAS is very new for me. And I like On Prem IDEs 🙂 therefore I like to connect local VS code with the cloud development environment.

[christian_d]

im running into this error after loging in with success.

error

[manas27]

Hi Everyone,

I could not find this extension in the BAS. Can you please help?

BAS Extensions

Thanks,

Manas

[AntalP]

Hi Manas,

The "SAP Business Application Studio toolkit" is installed by default in BAS, it cannot be found in this list.

It can be checked in the "Show Running Extensions".

[negroseptiembrenegro56]

Hi Community,

I'm on VSC and when choose "Preview Application" on project's "Application info" ... and choose "Start fiori run --open...."

... and select either "open in Browser" or "preview in Editor"... 

it shows: 

Can you help me?... In SAP BAS it works...

[rotem_puterman-sobe]

Hi @negroseptiembrenegro56 

The VS Code client is notifying on each server running on the remote container. The specific server running on localhost:8887 is the dev space proxy server, allowing the connectivity to BTP destination. This is not your running SAP Fiori app.

To access the Fiori app in browser, open the "Ports" view (either from the link in this notification, or from the VS Code UI - see the tab next to "Terminal"), and select to open your application in the browser from there (usually Fiori apps are running in port 8080).

Note that it will open the application root (from localhost:8080). To access the specific content, you'll need to add the path as defined in the application's "start" script after the --open arg (you can copy it from the package.json file of your app).

Best regards,

Rotem