testing window type

Author: Fabiana Fonseca

react/components/CustomButton.tsx

@@ -1,19 +1,15 @@
 import React, { Component } from 'react'
 
 import Table from './Table'
-
 import { OrderFormItem } from '../typings/orderForm'
 
-class CustomButton extends Component<CustomButtonProps, CustomButtonState> {
-  /**
-   * This component is responsible for rendering the custom button itself. For instance,
-   * we use it to render a table that contains the name of the items that are in the
-   * order form.
-  */
-  constructor(props: any) {
-    super(props)
-  }
-  render() {
+/**
+ * This component is responsible for rendering the custom button itself. For instance,
+ * we use it to render a table that contains the name of the items that are in the
+ * order form.
+ */
+class CustomButton extends Component<CustomButtonProps, {}> {
+  public render() {
     const { items } = this.props
 
     return items ? (
@@ -31,6 +27,6 @@ interface CustomButtonProps {
   items: OrderFormItem[]
 }
 
-interface CustomButtonState {}
+// interface CustomButtonState {}
 
 export default CustomButton

react/index.tsx

@@ -3,8 +3,8 @@ import React, { Component } from 'react'
 import CustomButton from './components/CustomButton'
 import { OrderForm } from './typings/orderForm'
 
-class CheckoutButtonExample extends Component<
-  CheckoutButtonExampleProps,
+class CheckoutButtonExample extends React.Component<
+  {},
   CheckoutButtonExampleState
 > {
   /**
@@ -20,19 +20,22 @@ class CheckoutButtonExample extends Component<
     }
   }
 
-  listenOrderFormUpdated = () => {
+  public listenOrderFormUpdated() {
     $(window).on('orderFormUpdated.vtex', (_: any, orderForm: OrderForm) =>
       this.setState({ orderForm })
     )
   }
 
-  render() {
+  public render() {
     this.listenOrderFormUpdated()
+
+    console.log(window.vtex.i18n.getLocale())
+
     return <CustomButton {...this.state.orderForm!} />
   }
 }
 
-interface CheckoutButtonExampleProps {}
+// interface CheckoutButtonExampleProps {}
 
 interface CheckoutButtonExampleState {
   orderForm: OrderForm | null

react/typings/orderForm.d.ts

@@ -1,3 +1,7 @@
+declare global {
+  type Window = any
+}
+
 export interface OrderFormContext {
   orderForm: OrderForm
   loading: boolean