(DOCSP-27598): Clean up web auth examples (#2640)

## Pull Request Info

Clean up auth examples

### Jira

- https://jira.mongodb.org/browse/DOCSP-27598

### Staged Changes

- [Authentication - Web
SDK](https://docs-mongodbcom-staging.corp.mongodb.com/realm/docsworker-xlarge/DOCSP-27598/web/authenticate)

### Reminder Checklist

If your PR modifies the docs, you might need to also update some
corresponding
pages. Check if completed or N/A.

- [x] Create Jira ticket for corresponding docs-app-services update(s),
if any
- [x] Checked/updated Admin API
- [x] Checked/updated CLI reference

### Review Guidelines


[REVIEWING.md](https://github.com/mongodb/docs-realm/blob/master/REVIEWING.md)

---------

Co-authored-by: Nick Larew <[email protected]>

Author: mongodben

examples/web/src/__tests__/authentication-log-in-and-out.test.js

@@ -1,16 +1,12 @@
 async function loginAnonymous() {
   // Create an anonymous credential
   const credentials = Realm.Credentials.anonymous();
-  try {
-    // Authenticate the user
-    const user = await app.logIn(credentials);
-    // `App.currentUser` updates to match the logged in user
-    console.assert(user.id === app.currentUser.id);
-    return user;
-  } catch (err) {
-    console.error("Failed to log in", err);
-  }
+
+  // Authenticate the user
+  const user = await app.logIn(credentials);
+  // `App.currentUser` updates to match the logged in user
+  console.assert(user.id === app.currentUser.id);
+
+  return user;
 }
 const user = await loginAnonymous();
-console.log("Successfully logged in!", user.id);
-

source/examples/generated/web/authentication-log-in-and-out.test.snippet.anon-auth.js

@@ -1,15 +1,14 @@
 async function loginApiKey(apiKey) {
   // Create an API Key credential
   const credentials = Realm.Credentials.apiKey(apiKey);
-  try {
-    // Authenticate the user
-    const user = await app.logIn(credentials);
-    // `App.currentUser` updates to match the logged in user
-    console.assert(user.id === app.currentUser.id);
-    return user;
-  } catch (err) {
-    console.error("Failed to log in", err);
-  }
+
+  // Authenticate the user
+  const user = await app.logIn(credentials);
+
+  // `App.currentUser` updates to match the logged in user
+  console.assert(user.id === app.currentUser.id);
+
+  return user;
 }
+
 const user = await loginApiKey(REALM_API_KEY.key); // add previously generated API key
-console.log("Successfully logged in!", user);

source/examples/generated/web/authentication-log-in-and-out.test.snippet.api-key-auth.js

@@ -1,12 +1,8 @@
 // Get the ID token from the Apple SDK
-AppleID.auth
-  .signIn()
-  .then(({ id_token }) => {
-    // Define credentials with the ID token from the Apple SDK
-    const credentials = Realm.Credentials.apple(id_token);
-    // Log the user in to your app
-    return app.logIn(credentials);
-  })
-  .then((user) => {
-    console.log(`Logged in with id: ${user.id}`);
-  });
+const { id_token } = await AppleID.auth.signIn();
+
+// Define credentials with the ID token from the Apple SDK
+const credentials = Realm.Credentials.apple(id_token);
+
+// Log the user in to your app
+const user = await app.logIn(credentials);

source/examples/generated/web/authentication-log-in-and-out.test.snippet.apple-sdk-oauth.js

@@ -0,0 +1,5 @@
+// When the user is redirected back to your app, handle the redirect to
+// save the user's access token and close the redirect window. This
+// returns focus to the original application window and automatically
+// logs the user in.
+Realm.handleAuthRedirect();

source/examples/generated/web/authentication-log-in-and-out.test.snippet.builtin-apple-oath-handle-redirect.js

@@ -4,14 +4,8 @@ const redirectUri = "https://app.example.com/handleOAuthLogin";
 const credentials = Realm.Credentials.apple(redirectUri);
 
 // Calling logIn() opens an Apple authentication screen in a new window.
-app.logIn(credentials).then((user) => {
-  // The logIn() promise will not resolve until you call `handleAuthRedirect()`
-  // from the new window after the user has successfully authenticated.
-  console.log(`Logged in with id: ${user.id}`);
-});
+const user = app.logIn(credentials);
 
-// When the user is redirected back to your app, handle the redirect to
-// save the user's access token and close the redirect window. This
-// returns focus to the original application window and automatically
-// logs the user in.
-Realm.handleAuthRedirect();
+// The logIn() promise will not resolve until you call `Realm.handleAuthRedirect()`
+// from the new window after the user has successfully authenticated.
+console.log(`Logged in with id: ${user.id}`);

source/examples/generated/web/authentication-log-in-and-out.test.snippet.builtin-apple-oauth.js

@@ -0,0 +1,5 @@
+// When the user is redirected back to your app, handle the redirect to
+// save the user's access token and close the redirect window. This
+// returns focus to the original application window and automatically
+// logs the user in.
+Realm.handleAuthRedirect();

source/examples/generated/web/authentication-log-in-and-out.test.snippet.builtin-facebook-oauth-redirect.js

@@ -4,14 +4,8 @@ const redirectUri = "https://app.example.com/handleOAuthLogin";
 const credentials = Realm.Credentials.facebook(redirectUri);
 
 // Calling logIn() opens a Facebook authentication screen in a new window.
-app.logIn(credentials).then((user) => {
-  // The logIn() promise will not resolve until you call `handleAuthRedirect()`
-  // from the new window after the user has successfully authenticated.
-  console.log(`Logged in with id: ${user.id}`);
-});
+const user = await app.logIn(credentials);
 
-// When the user is redirected back to your app, handle the redirect to
-// save the user's access token and close the redirect window. This
-// returns focus to the original application window and automatically
-// logs the user in.
-Realm.handleAuthRedirect();
+// The app.logIn() promise will not resolve until you call `Realm.handleAuthRedirect()`
+// from the new window after the user has successfully authenticated.
+console.log(`Logged in with id: ${user.id}`);

source/examples/generated/web/authentication-log-in-and-out.test.snippet.builtin-facebook-oauth.js

@@ -1,16 +1,12 @@
 async function loginCustomFunction(payload) {
   // Create a Custom Function credential
   const credentials = Realm.Credentials.function(payload);
-  try {
-    // Authenticate the user
-    const user = await app.logIn(credentials);
-    // `App.currentUser` updates to match the logged in user
-    console.assert(user.id === app.currentUser.id);
-    return user;
-  } catch (err) {
-    console.error("Failed to log in", err);
-  }
+
+  // Authenticate the user
+  const user = await app.logIn(credentials);
+  // `App.currentUser` updates to match the logged in user
+  console.assert(user.id === app.currentUser.id);
+
+  return user;
 }
-loginCustomFunction({ username: "ilovemongodb" }).then((user) => {
-  console.log("Successfully logged in!", user);
-});
+const user = await loginCustomFunction({ username: "ilovemongodb" });

source/examples/generated/web/authentication-log-in-and-out.test.snippet.custom-function-auth.js

@@ -1,16 +1,12 @@
 async function loginCustomJwt(jwt) {
   // Create a Custom JWT credential
   const credentials = Realm.Credentials.jwt(jwt);
-  try {
-    // Authenticate the user
-    const user = await app.logIn(credentials);
-    // `App.currentUser` updates to match the logged in user
-    console.assert(user.id === app.currentUser.id);
-    return user;
-  } catch (err) {
-    console.error("Failed to log in", err);
-  }
+
+  // Authenticate the user
+  const user = await app.logIn(credentials);
+  // `App.currentUser` updates to match the logged in user
+  console.assert(user.id === app.currentUser.id);
+
+  return user;
 }
-loginCustomJwt("eyJ0eXAi...Q3NJmnU8oP3YkZ8").then((user) => {
-  console.log("Successfully logged in!", user);
-});
+const user = await loginCustomJwt("eyJ0eXAi...Q3NJmnU8oP3YkZ8");

source/examples/generated/web/authentication-log-in-and-out.test.snippet.custom-jwt.js

@@ -1,16 +1,13 @@
 async function loginEmailPassword(email, password) {
   // Create an email/password credential
   const credentials = Realm.Credentials.emailPassword(email, password);
-  try {
-    // Authenticate the user
-    const user = await app.logIn(credentials);
-    // `App.currentUser` updates to match the logged in user
-    console.assert(user.id === app.currentUser.id);
-    return user;
-  } catch (err) {
-    console.error("Failed to log in", err);
-  }
+
+  // Authenticate the user
+  const user = await app.logIn(credentials);
+  // `App.currentUser` updates to match the logged in user
+  console.assert(user.id === app.currentUser.id);
+
+  return user;
 }
 
 const user = await loginEmailPassword("[email protected]", "passw0rd");
-console.log("Successfully logged in!", user);

source/examples/generated/web/authentication-log-in-and-out.test.snippet.email-password-auth.js

@@ -3,6 +3,4 @@ const { accessToken } = FB.getAuthResponse();
 // Define credentials with the access token from the Facebook SDK
 const credentials = Realm.Credentials.facebook(accessToken);
 // Log the user in to your app
-app.logIn(credentials).then((user) => {
-  console.log(`Logged in with id: ${user.id}`);
-});
+await app.logIn(credentials);

source/examples/generated/web/authentication-log-in-and-out.test.snippet.facebook-sdk-oauth.js

@@ -35,7 +35,6 @@ To log in, create an anonymous credential and pass it to ``App.logIn()``:
 
 .. literalinclude:: /examples/generated/web/authentication-log-in-and-out.test.snippet.anon-auth.js
     :language: javascript
-    :emphasize-lines: 3, 6
 
 .. _web-login-email-password:
 
@@ -51,7 +50,6 @@ password and pass it to ``App.logIn()``:
 
 .. literalinclude:: /examples/generated/web/authentication-log-in-and-out.test.snippet.email-password-auth.js
     :language: javascript
-    :emphasize-lines: 3, 6
 
 .. _web-login-api-key:
 
@@ -66,7 +64,6 @@ API key and pass it to ``App.logIn()``:
 
 .. literalinclude:: /examples/generated/web/authentication-log-in-and-out.test.snippet.api-key-auth.js
     :language: javascript
-    :emphasize-lines: 3, 6
 
 .. _web-login-custom-function:
 
@@ -82,7 +79,6 @@ with a payload object and pass it to ``App.logIn()``:
 
 .. literalinclude:: /examples/generated/web/authentication-log-in-and-out.test.snippet.custom-function-auth.js
     :language: javascript
-    :emphasize-lines: 3, 6
 
 .. _web-login-custom-jwt:
 
@@ -99,7 +95,6 @@ and pass it to ``App.logIn()``:
 
 .. literalinclude:: /examples/generated/web/authentication-log-in-and-out.test.snippet.custom-jwt.js
     :language: javascript
-    :emphasize-lines: 3, 6
 
 
 .. _web-login-facebook:
@@ -129,16 +124,19 @@ require you to install the Facebook SDK. The built in flow follows three main st
    specify a URL for your app that is also listed as a redirect URI in the
    provider configuration.
 
+   .. literalinclude:: /examples/generated/web/authentication-log-in-and-out.test.snippet.builtin-facebook-oauth.js
+      :language: javascript
+
 2. A new window opens to a Facebook authentication screen and the user
    authenticates and authorizes your app in that window. Once complete, the new
    window redirects to the URL specified in the credential.
 
-3. You call ``handleAuthRedirect()`` on the redirected page, which stores the
+3. You call ``Realm.handleAuthRedirect()`` on the redirected page, which stores the
    user's Atlas App Services access token and closes the window. Your original app window will
    automatically detect the access token and finish logging the user in.
 
-.. literalinclude:: /examples/generated/web/authentication-log-in-and-out.test.snippet.builtin-facebook-oauth.js
-   :language: javascript
+   .. literalinclude:: /examples/generated/web/authentication-log-in-and-out.test.snippet.builtin-facebook-oauth-redirect.js
+      :language: javascript
 
 .. _web-facebook-auth-token:
 
@@ -195,7 +193,7 @@ is a Google SDK that lets users sign up to or log in to a website with one click
     This example shows how to set up Google Authentication with App Services in
     a very basic web app. The app only contains an ``index.html`` file.
 
-    .. code-block:: html
+    .. code-block:: xml
       :caption: index.html
 
       <!DOCTYPE html>
@@ -257,7 +255,7 @@ require you to install a Google SDK. The built-in flow follows three main steps:
    authenticates and authorizes your app in that window. Once complete, the new
    window redirects to the URL specified in the credential.
 
-#. Call ``handleAuthRedirect()`` on the redirected page, which stores the
+#. Call ``Realm.handleAuthRedirect()`` on the redirected page, which stores the
    user's App Services access token and closes the window. Your original app window will
    automatically detect the access token and finish logging the user in.
 
@@ -270,9 +268,9 @@ require you to install a Google SDK. The built-in flow follows three main steps:
 
       .
       ├── auth.html
-      ├── index.html
+      └── index.html
 
-    .. code-block:: html
+    .. code-block:: xml
       :caption: index.html
 
       <!DOCTYPE html>
@@ -311,7 +309,7 @@ require you to install a Google SDK. The built-in flow follows three main steps:
         </script>
       </html>
 
-    .. code-block:: html
+    .. code-block:: xml
       :caption: auth.html
 
       <!DOCTYPE html>
@@ -367,16 +365,19 @@ steps:
    specify a URL for your app that is also listed as a redirect URI in the
    provider configuration.
 
+   .. literalinclude:: /examples/generated/web/authentication-log-in-and-out.test.snippet.builtin-apple-oauth.js
+      :language: javascript
+
 2. A new window opens to an Apple authentication screen and the user
    authenticates and authorizes your app in that window. Once complete, the new
    window redirects to the URL specified in the credential.
 
-3. You call ``handleAuthRedirect()`` on the redirected page, which stores the
+3. You call ``Realm.handleAuthRedirect()`` on the redirected page, which stores the
    user's App Services access token and closes the window. Your original app window will
    automatically detect the access token and finish logging the user in.
 
-.. literalinclude:: /examples/generated/web/authentication-log-in-and-out.test.snippet.builtin-apple-oauth.js
-
+   .. literalinclude:: /examples/generated/web/authentication-log-in-and-out.test.snippet.builtin-apple-oath-handle-redirect.js
+      :language: javascript
 
 .. _web-apple-auth-token:
 

source/web/authenticate.txt

@@ -178,10 +178,6 @@ Find Multiple Documents
 
 You can find multiple documents using :js-sdk:`collection.find() <Realm.MongoDBCollection.html#find>`.
 
-The following snippet finds all documents that describe perennial plants in the
-:ref:`collection of documents that describe plants for sale in a group of stores
-<web-mongodb-example-dataset>`:
-
 The following snippet finds all documents in a
 :ref:`collection of documents that describe plants for sale in a group of stores
 <web-mongodb-example-dataset>` that contain a field named
@@ -195,6 +191,11 @@ Running this snippet produces output resembling the following:
 .. literalinclude:: /examples/generated/web/mongodb-data-access.test.snippet.find-multiple-documents-result.js
    :language: javascript
 
+You **cannot** use the ``.skip()`` operator with the Realm SDK.
+To paginate results, you can use range queries with the ``.sort()`` and ``.limit()``,
+as described in :manual:`Using Range Queries </reference/method/cursor.skip/#pagination-example>`
+documentation in the MongoDB Manual.
+
 .. _web-mongodb-count:
 
 Count Documents in the Collection