@ordergroove/offers 2.34.3-alpha-PR-779-4.16 → 2.34.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ordergroove/offers",
-  "version": "2.34.3-alpha-PR-779-4.16+3f8016c7",
+  "version": "2.34.3",
   "description": "offer state component",
   "author": "Eugenio Lattanzio <eugenio63@gmail.com>",
   "homepage": "https://github.com/ordergroove/plush-toys#readme",
@@ -47,5 +47,5 @@
   "devDependencies": {
     "@ordergroove/offers-templates": "^0.9.1"
   },
-  "gitHead": "3f8016c7cf813017bc1df684c0fa582fa499cbcf"
+  "gitHead": "d3e7deebb63e8f607ca07d7a0f1d298439c81449"
 }

package/src/components/OptinButton.js

@@ -54,12 +54,7 @@ export class OptinButton extends OptinStatus {
   render() {
     return html`
       <slot name="default">
-        <button
-          aria-labelledby="ogOfferOptInLabel"
-          role="radio"
-          aria-checked="${!!this.subscribed}"
-          class="btn radio ${this.subscribed ? 'active' : ''}"
-        ></button>
+        <button aria-labelledby="ogOfferOptInLabel" class="btn radio ${this.subscribed ? 'active' : ''}"></button>
         <label id="ogOfferOptInLabel">
           <slot>
             <slot name="label"><og-text key="offerOptInLabel"></og-text></slot>

package/src/components/OptoutButton.js

@@ -19,12 +19,7 @@ export class OptoutButton extends OptinStatus {
   render() {
     return html`
       <slot name="default">
-        <button
-          aria-labelledby="ogOfferOptOutLabel"
-          role="radio"
-          aria-checked="${!this.subscribed}"
-          class="btn radio ${this.subscribed ? '' : 'active'}"
-        ></button>
+        <button aria-labelledby="ogOfferOptOutLabel" class="btn radio ${this.subscribed ? '' : 'active'}"></button>
         <label id="ogOfferOptOutLabel">
           <slot>
             <og-text key="offerOptOutLabel"></og-text>

package/src/components/Price.js

@@ -1,4 +1,4 @@
-import { html } from 'lit-element';
+import { html, css } from 'lit-element';
 import { connect } from '../core/connect';
 
 import { withProduct } from '../core/resolveProperties';
@@ -19,6 +19,28 @@ export class Price extends withProduct(TemplateElement) {
     };
   }
 
+  static get styles() {
+    return css`
+      :host::before {
+        clip-path: inset(100%);
+        clip: rect(1px, 1px, 1px, 1px);
+        height: 1px;
+        overflow: hidden;
+        position: absolute;
+        white-space: nowrap;
+        width: 1px;
+      }
+
+      :host([subscription])::before {
+        content: 'Discounted subscription price';
+      }
+
+      :host([regular])::before {
+        content: 'Regular price';
+      }
+    `;
+  }
+
   get value() {
     const realProductId = safeProductId(this.product);
     const frequency = this.frequency || this.configDefaultFrequency || this.offer?.defaultFrequency;

package/src/components/__tests__/OptinButton.spec.js

@@ -13,22 +13,6 @@ describe('OptinButton', function() {
       expect(querySelector(element, 'button.active')).toBeTruthy();
     });
 
-    it('should be aria-checked if subscribed', async () => {
-      const element = new OptinButton();
-      element.setAttribute('product', '123');
-      element.subscribed = true;
-      await appendToBody(element);
-      expect(querySelector(element, 'button').getAttribute('aria-checked')).toEqual('true');
-    });
-
-    it('should not be aria-checked if not subscribed', async () => {
-      const element = new OptinButton();
-      element.setAttribute('product', '123');
-      element.subscribed = false;
-      await appendToBody(element);
-      expect(querySelector(element, 'button').getAttribute('aria-checked')).toEqual('false');
-    });
-
     it('should show empty label if not subscribed', async () => {
       const element = new OptinButton();
       element.setAttribute('product', '123');

package/src/components/__tests__/OptoutButton.spec.js

@@ -32,20 +32,4 @@ describe('OptoutButton', () => {
     await appendToBody(elm);
     expect(querySelector(elm, 'button.active')).toBeTruthy();
   });
-
-  it('should be aria-checked if subscribed', async () => {
-    const element = new OptoutButton();
-    element.setAttribute('product', '123');
-    element.subscribed = true;
-    await appendToBody(element);
-    expect(querySelector(element, 'button').getAttribute('aria-checked')).toEqual('false');
-  });
-
-  it('should not be aria-checked if not subscribed', async () => {
-    const element = new OptoutButton();
-    element.setAttribute('product', '123');
-    element.subscribed = false;
-    await appendToBody(element);
-    expect(querySelector(element, 'button').getAttribute('aria-checked')).toEqual('true');
-  });
 });