Skip to content

Commit 752251a

Browse files
authored
Merge pull request #1428 from MicrosoftDocs/johnsta
VS Connected Environment content - mobile device testing
2 parents 8918b78 + d4e6bbb commit 752251a

File tree

2 files changed

+20
-1
lines changed

2 files changed

+20
-1
lines changed

connected-environment/common/build-and-run-in-k8s-cli.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,4 +20,4 @@ Scan the console output for information about the public URL that was created by
2020

2121
`Running at public URL: https://<servicename>-<environmentname>.vsce.io`
2222

23-
Open this URL in a browser window - or better yet, from a mobile device - and you should see the web app load. As the container executes, `stdout` and `stderr` output is streamed to the terminal window.
23+
Open this URL in a browser window, and you should see the web app load. As the container executes, `stdout` and `stderr` output is streamed to the terminal window.

connected-environment/get-started-nodejs-03.md

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,25 @@ Connected Environment isn't just about getting code running in Kubernetes - it's
2525

2626
What happened? Edits to content files, like HTML and CSS, don't require the Node.js process to restart, so an active `vsce up` command will automatically sync any modified content files directly into the running container in Azure, thereby providing a fast way to see your content edits.
2727

28+
### Test from a mobile device
29+
If you open the web app on a mobile device, you will notice that the UI does not display properly on a small device.
30+
31+
To fix this, we'll add a `viewport` meta tag:
32+
1. Open the file `./public/index.html`
33+
1. Add a `viewport` meta tag in the existing `header` tag:
34+
35+
```html
36+
<header>
37+
<!-- Add this line -->
38+
<meta name="viewport" content="width=device-width, initial-scale=1">
39+
</header>
40+
```
41+
42+
1. Save the file.
43+
1. Refresh your device's browser. You should now see the web app rendered correctly.
44+
45+
This is an example of how some problems just aren't found until you test on the devices an app is meant to be used. With VS Connected Environment you can rapidly iterate on your code and validate any changes on target devices.
46+
2847
## Update a code file
2948
Updating server-side code files requires a little more work, because a Node.js app needs to restart.
3049

0 commit comments

Comments
 (0)