mendix · EnasAbdelrazek · May 13, 2025 · May 13, 2025 · May 13, 2025 · May 14, 2025
diff --git a/content/en/docs/howto/security/csp.md b/content/en/docs/howto/security/csp.md
@@ -33,6 +33,12 @@ To upgrade your theme directory to latest version, complete the following steps:
 
 ### Changing the Theme
 
+#### In Dojo Client
+
+{{% alert color="warning" %}}
+In Mendix 11.0 and above, the Dojo Client is deprecated.
+{{% /alert %}}
+
 Create a new file to contain the Dojo configuration in your theme folder (*theme/web/appSetup.js*) with the following configuration:
 
 ```js
@@ -52,8 +58,11 @@ window.dojoConfig = {
 	blankGif: "mxclientsystem/dojo/resources/blank.gif"
 };
 
-if (!document.cookie || !document.cookie.match(/(^|;) *originURI=/gi))
-	document.cookie = "originURI=/login.html" + (window.location.protocol === "https:" ? ";SameSite=None;Secure" : "");
+if (!document.cookie || !document.cookie.match(/(^|;) *originURI=/gi)) {
+    const url = new URL(window.location.href);
+    const subPath = url.pathname.substring(0, url.pathname.lastIndexOf("/"));
+    document.cookie = `originURI=${subPath}/login.html${window.location.protocol === "https:" ? ";SameSite=None;Secure" : ""}`;
+}
 ```
 
 Create a second file to contain the script for unsupported browsers (*theme/web/unsupported-browser.js*):
@@ -100,6 +109,68 @@ In *theme/web/index.html* do the following:
 
 Lastly, ensure you are not using any external fonts by checking your theme's styling to confirm all of the fonts are loaded locally.
 
+#### In React Client
+
+{{% alert color="info" %}}
+In Mendix 11.0 and above, the React Client is the default for new applications and the legacy Dojo Client is deprecated.
+{{% /alert %}}
+
+Create a new file in your theme folder (*theme/web/appSetup.js*) with the following:
+
+```js
+if (!document.cookie || !document.cookie.match(/(^|;) *originURI=/gi)) {
+    const url = new URL(window.location.href);
+    const subPath = url.pathname.substring(0, url.pathname.lastIndexOf("/"));
+
+    document.cookie = `originURI=${subPath}/login.html${window.location.protocol === "https:" ? ";SameSite=None;Secure" : ""}`;
+}
+```
+
+Create a second file to contain the script for unsupported browsers (*theme/web/unsupported-browser.js*):
+
+```js
+// Redirect to unsupported browser page if opened from browser that doesn't support Symbols
+if (typeof Symbol !== "function") {
+    var homeUrl = window.location.origin + window.location.pathname;
+    var appUrl = homeUrl.slice(0, homeUrl.lastIndexOf("/") + 1);
+    window.location.replace(appUrl + "unsupported-browser.html");
+}
+```
+
+Finally, the *theme/web/index.html* file needs to be changed to use these files directly. If you lack this file, please follow the [Customizing index.html (Web)](/howto/front-end/customize-styling-new/#custom-web) section of *Customize Styling*.
+
+In *theme/web/index.html* do the following:
+
+1. Remove the line with the `{{unsupportedbrowsers}}` tag
+1. Remove the `<script>` which tells the client where to redirect to if a user is required to log in
+1. At the top of the `<head`> tag, add a reference to the `unsupported-browser.js` script:
+
+    ```js
+    <html>
+        <head>
+            <script src="unsupported-browser.js"></script>
+            ...
+        </head>
+        ...
+    </html>
+    ```
+
+1. In the `<body>` tag, add a reference to the `appSetup.js` script before `index.js` is loaded:
+
+    ```js
+    <html>
+        <body>
+            ...
+            <div id-"content"></div>
+            <script src="appSetup.js"></script>
+            <script src="dist/index.js?{{cachebust}}"></script>
+        </body>
+    </html>
+    ```
+
+Lastly, ensure you are not using any external fonts by checking your theme's styling to confirm all of the fonts are loaded locally.
+
+
 #### Testing Your Changes Locally
 
 To check that your changes are working locally, you can add a custom `Content-Security-Policy` header in your [configuration](/refguide/configuration/#headers).

diff --git a/content/en/docs/howto10/security/csp.md b/content/en/docs/howto10/security/csp.md
@@ -33,6 +33,8 @@ To upgrade your theme directory to latest version, complete the following steps:
 
 ### Changing the Theme
 
+##### In Dojo Client
+
 Create a new file to contain the Dojo configuration in your theme folder (*theme/web/appSetup.js*) with the following configuration:
 
 ```js
@@ -52,8 +54,12 @@ window.dojoConfig = {
 	blankGif: "mxclientsystem/dojo/resources/blank.gif"
 };
 
-if (!document.cookie || !document.cookie.match(/(^|;) *originURI=/gi))
-	document.cookie = "originURI=/login.html" + (window.location.protocol === "https:" ? ";SameSite=None;Secure" : "");
+if (!document.cookie || !document.cookie.match(/(^|;) *originURI=/gi)) {
+    const url = new URL(window.location.href);
+    const subPath = url.pathname.substring(0, url.pathname.lastIndexOf("/"));
+
+    document.cookie = `originURI=${subPath}/login.html${window.location.protocol === "https:" ? ";SameSite=None;Secure" : ""}`;
+}
 ```
 
 Create a second file to contain the script for unsupported browsers (*theme/web/unsupported-browser.js*):
@@ -100,6 +106,67 @@ In *theme/web/index.html* do the following:
 
 Lastly, ensure you are not using any external fonts by checking your theme's styling to confirm all of the fonts are loaded locally.
 
+#### In React Client
+
+{{% alert color="info" %}}
+In Mendix versions 10.7.0 and above, there is an alternative version of the Mendix Client written in React. This React client was released into [beta](/releasenotes/beta-features/) in Mendix 10.7. As of Mendix 10.18, it is in GA. 
+{{% /alert %}}
+
+Create a new file in your theme folder (*theme/web/appSetup.js*) with the following:
+
+```js
+if (!document.cookie || !document.cookie.match(/(^|;) *originURI=/gi)) {
+    const url = new URL(window.location.href);
+    const subPath = url.pathname.substring(0, url.pathname.lastIndexOf("/"));
+
+    document.cookie = `originURI=${subPath}/login.html${window.location.protocol === "https:" ? ";SameSite=None;Secure" : ""}`;
+}
+```
+
+Create a second file to contain the script for unsupported browsers (*theme/web/unsupported-browser.js*):
+
+```js
+// Redirect to unsupported browser page if opened from browser that doesn't support Symbols
+if (typeof Symbol !== "function") {
+    var homeUrl = window.location.origin + window.location.pathname;
+    var appUrl = homeUrl.slice(0, homeUrl.lastIndexOf("/") + 1);
+    window.location.replace(appUrl + "unsupported-browser.html");
+}
+```
+
+Finally, the *theme/web/index.html* file needs to be changed to use these files directly. If you lack this file, please follow the [Customizing index.html (Web)](/howto/front-end/customize-styling-new/#custom-web) section of *Customize Styling*.
+
+In *theme/web/index.html* do the following:
+
+1. Remove the line with the `{{unsupportedbrowsers}}` tag
+1. Remove the `<script>` which tells the client where to redirect to if a user is required to log in
+1. At the top of the `<head`> tag, add a reference to the `unsupported-browser.js` script:
+
+    ```js
+    <html>
+        <head>
+            <script src="unsupported-browser.js"></script>
+            ...
+        </head>
+        ...
+    </html>
+    ```
+
+1. In the `<body>` tag, add a reference to the `appSetup.js` script before `index.js` is loaded:
+
+    ```js
+    <html>
+        <body>
+            ...
+            <div id-"content"></div>
+            <script src="appSetup.js"></script>
+            <script src="dist/index.js?{{cachebust}}"></script>
+        </body>
+    </html>
+    ```
+
+Lastly, ensure you are not using any external fonts by checking your theme's styling to confirm all of the fonts are loaded locally.
+
 #### Testing Your Changes Locally
 
 To check that your changes are working locally, you can add a custom `Content-Security-Policy` header in your [configuration](/refguide10/configuration/#headers).

diff --git a/content/en/docs/refguide/modeling/app-explorer/app/app-settings/_index.md b/content/en/docs/refguide/modeling/app-explorer/app/app-settings/_index.md
@@ -28,10 +28,12 @@ These settings influence the behavior of the Runtime when running your applicati
 
 ### Use React Client {#react-client}
 
-This setting enables the new React version of the Mendix Client. There are three options:
+This setting enables the React version of the Mendix Client. In Mendix 11.0 and above, the React Client is the default for new applications and the legacy Dojo Client is deprecated. 
 
-* **No**: Do not use the React client (default).
-* **Yes**: Use the React client. In this mode, you will get consistency errors for incompatible widgets.
+The available configuration options are as follows:
+
+* **No**: Do not use the React client. This option will trigger a deprecation warning, as the Dojo client is deprecated.
+* **Yes**: Use the React client (default). In this mode, you will get consistency errors for incompatible widgets.
 * **Migration mode**: Use the React client and ignore incompatible widgets. Placeholders are displayed in the case of incompatible widgets. Recommended when trying out the new client.
 
 ### Static Resources from Disk

diff --git a/content/en/docs/refguide/runtime/mendix-client/_index.md b/content/en/docs/refguide/runtime/mendix-client/_index.md
@@ -12,7 +12,7 @@ The Mendix Client runs on the end-user's device and serves as the interface betw
 The above description of the Mendix Client is based on using the Runtime Server of an app running in the cloud. You can also run Mendix locally for testing, which works in a conceptually similar way.
 
 {{% alert color="info" %}}
-There is an alternative version of the Mendix Client written in React. This is currently a [beta](/releasenotes/beta-features/). You can enable this React client in [App Settings](/refguide/app-settings/#react-client).
+The Mendix Client has transitioned to a modern implementation using React. In Mendix 11.0 and above, the React Client is the default for new applications and the legacy Dojo Client is deprecated.
 
 The React client replaces [Dojo](https://dojotoolkit.org/) with [React](https://react.dev/) for the view layer. This means that widgets based on Dojo will no longer work. You will get consistency errors if your app contains Dojo widgets, or you can choose **Migration mode** which will allow you to build your app but will replace incompatible widgets with a placeholder.
 
@@ -215,6 +215,10 @@ When the end-user launches an app in the browser, it triggers the following flow
     The Mendix Client is now ready to start interacting with the end-user.
 
 ##### Dojo Client
+
+{{% alert color="warning" %}}
+In Mendix 11.0 and above, the Dojo Client is deprecated.
+{{% /alert %}}
 
 The Mendix Dojo Client, which is not built entirely using React, will repeat the following steps for as long as the end-user’s session continues.
 
@@ -227,7 +231,7 @@ The Mendix Dojo Client, which is not built entirely using React, will repeat the
 
 ##### React Client
 
-The React client works differently than the Dojo client.
+The React client is the default client used for new applications created with Mendix 11.0 and above, and it works differently than the Dojo client.
 
 During the build process, Studio Pro exports JavaScript files containing JavaScript and React components into the `pages`, `layouts` and `nanoflows` folders. The contents of those folders are bundled into the `dist` folder using [Rollup](https://rollupjs.org/), which generates *chunks*.
 

diff --git a/content/en/docs/refguide/runtime/mendix-client/react.md b/content/en/docs/refguide/runtime/mendix-client/react.md
@@ -7,7 +7,9 @@ weight: 10
 
 ## Introduction
 
-There is an alternative version of the Mendix Client written in React. You can enable this React client in [App Settings](/refguide/app-settings/#react-client).
+The Mendix Client has transitioned to a modern implementation using React. As of Mendix 11, the React Client is the default for all new applications created in Studio Pro, and the legacy Dojo client has been deprecated.
+
+You can enable the React client for existing applications in [App Settings](/refguide/app-settings/#react-client).
 
 The React client replaces [Dojo](https://dojotoolkit.org/) with [React](https://react.dev/) for the view layer. This change allows for improved performance, enables incremental loading, and future-proofs your application. For more information on these three aspects, see the sections below:
 

diff --git a/content/en/docs/refguide10/runtime/mendix-client/_index.md b/content/en/docs/refguide10/runtime/mendix-client/_index.md
@@ -12,7 +12,7 @@ The Mendix Client runs on the end-user's device and serves as the interface betw
 The above description of the Mendix Client is based on using the Runtime Server of an app running in the cloud. You can also run Mendix locally for testing, which works in a conceptually similar way.
 
 {{% alert color="info" %}}
-In Studio Pro versions 10.7.0 and above, there is an alternative version of the Mendix Client written in React. This is currently a [beta](/releasenotes/beta-features/). You can enable this React client in [App Settings](/refguide10/app-settings/#react-client).
+In Studio Pro versions 10.7.0 and above, there is an alternative version of the Mendix Client written in React. This React client was released into [beta](/releasenotes/beta-features/) in Mendix 10.7. As of Mendix 10.18, it is in GA. 
 
 The React client replaces [Dojo](https://dojotoolkit.org/) with [React](https://react.dev/) for the view layer. This means that widgets based on Dojo will no longer work. You will get consistency errors if your app contains Dojo widgets, or you can choose **Migration mode** which will allow you to build your app but will replace incompatible widgets with a placeholder.
 

diff --git a/content/en/docs/support/security-findings-faq.md b/content/en/docs/support/security-findings-faq.md
@@ -221,9 +221,13 @@ For example, the old version of the [LDAP Synchronization module](https://market
 
 ### Dojo library 
 
+{{% alert color="info" %}}
+The Dojo library is only used with the Dojo Client and not with the React Client.
+{{% /alert %}}
+
 #### deepCopy Vulnerability - CVE-2020-5258
 
-The Mendix Client is bundled with the full dojo library. However, not all functionality of the Dojo library is used. The vulnerability is in the `deepCopy` util method of dojo; this method is not used in the Mendix Client. This vulnerability cannot be exploited in the client.
+When the Dojo client is used, the Mendix Client is bundled with the full dojo library. However, not all functionality of the Dojo library is used. The vulnerability is in the `deepCopy` util method of dojo; this method is not used in the Mendix Client. This vulnerability cannot be exploited in the client.
 
 #### Prototype Pollution Vulnerability - CVE-2021-23450