Make the start shopping button show the theme style (https://github.com/woocommerce/woocommerce-blocks/pull/8567)

* Make the start shopping button show the theme style

* Center the button

* Fix test

plugins/woocommerce-blocks/assets/js/blocks/mini-cart/mini-cart-contents/inner-blocks/mini-cart-shopping-button-block/block.tsx

@@ -2,6 +2,7 @@
  * External dependencies
  */
 import { SHOP_URL } from '@woocommerce/block-settings';
+import Button from '@woocommerce/base-components/button';
 import classNames from 'classnames';
 
 /**
@@ -23,15 +24,16 @@ const Block = ( {
 	}
 
 	return (
-		<div
-			className={ classNames(
-				className,
-				'wc-block-mini-cart__shopping-button'
-			) }
-		>
-			<a href={ SHOP_URL }>
+		<div className="wp-block-button has-text-align-center">
+			<Button
+				className={ classNames(
+					className,
+					'wc-block-mini-cart__shopping-button'
+				) }
+				href={ SHOP_URL }
+			>
 				{ startShoppingButtonLabel || defaultStartShoppingButtonLabel }
-			</a>
+			</Button>
 		</div>
 	);
 };

plugins/woocommerce-blocks/tests/e2e/specs/shopper/mini-cart.test.js

@@ -191,7 +191,7 @@ describe( 'Shopper → Mini Cart', () => {
 			);
 
 			const shopLink = await page.$eval(
-				'.wc-block-mini-cart__shopping-button a',
+				'a.wc-block-mini-cart__shopping-button',
 				( el ) => el.href
 			);