magic-sdk - npm Package Compare versions

Comparing version 4.0.2 to 4.1.0

CHANGELOG.md

@@ -0,1 +1,13 @@
+# v4.1.0 (Sat Jan 23 2021)
+
+#### 🚀 Enhancement
+
+- Iframe accessibility improvements: Add `title` attribute and auto-focus when UI is showing [#158](https://github.com/magiclabs/magic-js/pull/158) ([@smithki](https://github.com/smithki))
+
+#### Authors: 1
+
+- Ian K Smith ([@smithki](https://github.com/smithki))
+
+---
+
 # v4.0.1 (Tue Dec 01 2020)
@@ -2,0 +14,0 @@

dist/commonjs/iframe-controller.d.ts

@@ -7,2 +7,3 @@ import { ViewController } from '@magic-sdk/provider';
     private iframe;
+    private activeElement;
     protected init(): void;
@@ -9,0 +10,0 @@ protected showOverlay(): Promise<void>;

dist/commonjs/iframe-controller.js

 "use strict";
+/* eslint-disable no-unused-expressions */
 /* eslint-disable no-underscore-dangle */
@@ -59,3 +60,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
     function IframeController() {
-        return _super !== null && _super.apply(this, arguments) || this;
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.activeElement = null;
+        return _this;
     }
@@ -70,2 +73,3 @@ IframeController.prototype.init = function () {
                     iframe.dataset.magicIframeLabel = provider_1.createURL(_this.endpoint).host;
+                    iframe.title = 'Secure Modal';
                     iframe.src = provider_1.createURL("/send?params=" + encodeURIComponent(_this.parameters), _this.endpoint).href;
@@ -99,2 +103,4 @@ applyOverlayStyles(iframe);
                         iframe.style.display = 'block';
+                        this.activeElement = document.activeElement;
+                        iframe.focus();
                         return [2 /*return*/];
@@ -106,10 +112,14 @@ }
     IframeController.prototype.hideOverlay = function () {
+        var _a;
         return tslib_1.__awaiter(this, void 0, void 0, function () {
             var iframe;
-            return tslib_1.__generator(this, function (_a) {
-                switch (_a.label) {
+            return tslib_1.__generator(this, function (_b) {
+                switch (_b.label) {
                     case 0: return [4 /*yield*/, this.iframe];
                     case 1:
-                        iframe = _a.sent();
+                        iframe = _b.sent();
                         iframe.style.display = 'none';
+                        if ((_a = this.activeElement) === null || _a === void 0 ? void 0 : _a.focus)
+                            this.activeElement.focus();
+                        this.activeElement = null;
                         return [2 /*return*/];
@@ -116,0 +126,0 @@ }

dist/commonjs/index.cdn.js

@@ -15,3 +15,3 @@ "use strict";
     sdkName: 'magic-sdk',
-    version: '4.0.2',
+    version: '4.1.0',
     defaultEndpoint: 'https://auth.magic.link/',
@@ -18,0 +18,0 @@ ViewController: iframe_controller_1.IframeController,

dist/commonjs/index.js

@@ -14,3 +14,3 @@ "use strict";
     sdkName: 'magic-sdk',
-    version: '4.0.2',
+    version: '4.1.0',
     defaultEndpoint: 'https://auth.magic.link/',
@@ -17,0 +17,0 @@ ViewController: iframe_controller_1.IframeController,

dist/module/iframe-controller.d.ts

@@ -7,2 +7,3 @@ import { ViewController } from '@magic-sdk/provider';
     private iframe;
+    private activeElement;
     protected init(): void;
@@ -9,0 +10,0 @@ protected showOverlay(): Promise<void>;

dist/module/iframe-controller.js

@@ -0,1 +1,2 @@
+/* eslint-disable no-unused-expressions */
 /* eslint-disable no-underscore-dangle */
@@ -57,3 +58,5 @@ import { __awaiter, __extends, __generator, __read, __values } from "tslib";
     function IframeController() {
-        return _super !== null && _super.apply(this, arguments) || this;
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.activeElement = null;
+        return _this;
     }
@@ -68,2 +71,3 @@ IframeController.prototype.init = function () {
                     iframe.dataset.magicIframeLabel = createURL(_this.endpoint).host;
+                    iframe.title = 'Secure Modal';
                     iframe.src = createURL("/send?params=" + encodeURIComponent(_this.parameters), _this.endpoint).href;
@@ -97,2 +101,4 @@ applyOverlayStyles(iframe);
                         iframe.style.display = 'block';
+                        this.activeElement = document.activeElement;
+                        iframe.focus();
                         return [2 /*return*/];
@@ -104,10 +110,14 @@ }
     IframeController.prototype.hideOverlay = function () {
+        var _a;
         return __awaiter(this, void 0, void 0, function () {
             var iframe;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_b) {
+                switch (_b.label) {
                     case 0: return [4 /*yield*/, this.iframe];
                     case 1:
-                        iframe = _a.sent();
+                        iframe = _b.sent();
                         iframe.style.display = 'none';
+                        if ((_a = this.activeElement) === null || _a === void 0 ? void 0 : _a.focus)
+                            this.activeElement.focus();
+                        this.activeElement = null;
                         return [2 /*return*/];
@@ -114,0 +124,0 @@ }

dist/module/index.cdn.js

@@ -13,3 +13,3 @@ /* eslint-disable no-underscore-dangle */
     sdkName: 'magic-sdk',
-    version: '4.0.2',
+    version: '4.1.0',
     defaultEndpoint: 'https://auth.magic.link/',
@@ -16,0 +16,0 @@ ViewController: IframeController,

dist/module/index.js

@@ -12,3 +12,3 @@ /* eslint-disable no-underscore-dangle */
     sdkName: 'magic-sdk',
-    version: '4.0.2',
+    version: '4.1.0',
     defaultEndpoint: 'https://auth.magic.link/',
@@ -15,0 +15,0 @@ ViewController: IframeController,

package.json

 {
   "name": "magic-sdk",
-  "version": "4.0.2",
+  "version": "4.1.0",
   "description": "Passwordless authentication for the web.",
@@ -24,4 +24,4 @@ "author": "Magic Labs <[e-mail]> (https://magic.link/)",
     "@babel/runtime": "^7.9.6",
-    "@magic-sdk/commons": "^1.0.1",
-    "@magic-sdk/provider": "^4.0.2",
+    "@magic-sdk/commons": "^1.1.0",
+    "@magic-sdk/provider": "^4.1.0",
     "@magic-sdk/types": "^3.0.1",
@@ -60,3 +60,3 @@ "localforage": "^1.7.4",
   },
-  "gitHead": "06a7bdb91289eb7e61fbe7968c7a6cac6e7f059b"
+  "gitHead": "d59f35430501d258f4056250ea76fe5b2ce2ce7d"
 }

No alert changes

Improved metrics

Lines of code

901

2.62%

Worsened metrics

Total package byte prevSize

911197

-0.45%

Dependency changes

• Updated

  @magic-sdk/commons@^1.1.0

• Updated

  @magic-sdk/provider@^4.1.0