@ory/elements-react 1.0.0-next.20 → 1.0.0-next.22

package/CHANGELOG.md

@@ -1,3 +1,11 @@
+## 1.0.0-next.22 (2025-01-18)
+
+This was a version bump only for @ory/elements-react to align it with other projects, there were no code changes.
+
+## 1.0.0-next.21 (2025-01-18)
+
+This was a version bump only for @ory/elements-react to align it with other projects, there were no code changes.
+
 ## 1.0.0-next.20 (2025-01-16)
 
 ### 🚀 Features

package/README.md

@@ -174,3 +174,22 @@ watch mode use
 ```
 npx nx run @ory/elements-react:dev
 ```
+
+### Testing
+
+To run the tests use
+
+```
+nx lint @ory/elements-react
+nx test @ory/elements-react
+```
+
+#### Test selectors
+
+To select elements use a `data-testid` selector. Nomenclature mandates `/` as
+separators and a prefix of `ory/`:
+
+- `ory/form/` is the prefix for form elements;
+- `ory/screen/` is the prefix for elements on specific screens;
+- `ory/screen/` is the prefix for translatable messages (e.g. validation
+  errors).

package/dist/index.js

@@ -3541,7 +3541,7 @@ function SettingsSectionContent({ group, nodes }) {
       OryFormSection,
       {
         nodes: uniqueGroups.groups.totp,
-        "data-testid": "totp-settings",
+        "data-testid": "ory/screen/settings/group/totp",
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(OrySettingsTotp, { nodes: (_a = uniqueGroups.groups.totp) != null ? _a : [] }),
           (_b = uniqueGroups.groups.default) == null ? void 0 : _b.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
@@ -3554,7 +3554,7 @@ function SettingsSectionContent({ group, nodes }) {
       OryFormSection,
       {
         nodes: uniqueGroups.groups.lookup_secret,
-        "data-testid": "recovery-codes-settings",
+        "data-testid": "ory/screen/settings/group/lookup_secret",
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             OrySettingsRecoveryCodes,
@@ -3572,7 +3572,7 @@ function SettingsSectionContent({ group, nodes }) {
       OryFormSection,
       {
         nodes: uniqueGroups.groups.oidc,
-        "data-testid": "oidc-settings",
+        "data-testid": "ory/screen/settings/group/oidc",
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(OrySettingsOidc, { nodes: (_e = uniqueGroups.groups.oidc) != null ? _e : [] }),
           (_f = uniqueGroups.groups.default) == null ? void 0 : _f.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
@@ -3585,7 +3585,7 @@ function SettingsSectionContent({ group, nodes }) {
       OryFormSection,
       {
         nodes: uniqueGroups.groups.webauthn,
-        "data-testid": "webauthn-settings",
+        "data-testid": "ory/screen/settings/group/webauthn",
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(OrySettingsWebauthn, { nodes: (_g = uniqueGroups.groups.webauthn) != null ? _g : [] }),
           (_h = uniqueGroups.groups.default) == null ? void 0 : _h.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
@@ -3598,7 +3598,7 @@ function SettingsSectionContent({ group, nodes }) {
       OryFormSection,
       {
         nodes: uniqueGroups.groups.passkey,
-        "data-testid": "passkey-settings",
+        "data-testid": "ory/screen/settings/group/passkey",
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(OrySettingsPasskey, { nodes: (_i = uniqueGroups.groups.passkey) != null ? _i : [] }),
           (_j = uniqueGroups.groups.default) == null ? void 0 : _j.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
@@ -3606,28 +3606,35 @@ function SettingsSectionContent({ group, nodes }) {
       }
     );
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs(OryFormSection, { nodes, "data-testid": `${group}-settings`, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      Card.SettingsSectionContent,
-      {
-        title: intl.formatMessage({
-          id: `settings.${group}.title`
-        }),
-        description: intl.formatMessage({
-          id: `settings.${group}.description`
-        }),
-        children: [
-          (_k = uniqueGroups.groups.default) == null ? void 0 : _k.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k)),
-          nodes.filter(
-            (node) => "type" in node.attributes && node.attributes.type !== "submit"
-          ).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(Card.SettingsSectionFooter, { children: nodes.filter(
-      (node) => "type" in node.attributes && node.attributes.type === "submit"
-    ).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k)) })
-  ] });
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    OryFormSection,
+    {
+      nodes,
+      "data-testid": `ory/screen/settings/group/${group}`,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          Card.SettingsSectionContent,
+          {
+            title: intl.formatMessage({
+              id: `settings.${group}.title`
+            }),
+            description: intl.formatMessage({
+              id: `settings.${group}.description`
+            }),
+            children: [
+              (_k = uniqueGroups.groups.default) == null ? void 0 : _k.map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k)),
+              nodes.filter(
+                (node) => "type" in node.attributes && node.attributes.type !== "submit"
+              ).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k))
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(Card.SettingsSectionFooter, { children: nodes.filter(
+          (node) => "type" in node.attributes && node.attributes.type === "submit"
+        ).map((node, k) => /* @__PURE__ */ jsxRuntime.jsx(Node, { node }, k)) })
+      ]
+    }
+  );
 }
 var getScriptNode = (nodes) => nodes.find(
   (node) => "id" in node.attributes && node.attributes.id === "webauthn_script"
@@ -3699,7 +3706,7 @@ var uiTextToFormattedMessage = ({ id, context = {}, text }, intl) => {
 // src/util/test-id.ts
 function messageTestId(message) {
   return {
-    "data-testid": `ory/ui/message/${message.id}`
+    "data-testid": `ory/message/${message.id}`
   };
 }