added tests, used constant on replace function

packages/block-editor/src/utils/transform-styles/transforms/test/__snapshots__/wrap.js.snap

@@ -22,6 +22,24 @@ color: red;
 }"
 `;
 
+exports[`CSS selector wrap should replace :root selectors 1`] = `
+".my-namespace {
+--my-color: #ff0000;
+}"
+`;
+
+exports[`CSS selector wrap should replace add editor classes to buttons 1`] = `
+".my-namespace button:not(.components-button) {
+background-color: #ff0000;
+}"
+`;
+
+exports[`CSS selector wrap should replace add editor classes to inputs 1`] = `
+".my-namespace input:not(.components-text-control__input):not(.components-placeholder__input):not(.components-form-token-field__input) {
+border-color: #ff0000;
+}"
+`;
+
 exports[`CSS selector wrap should replace root tags 1`] = `
 ".my-namespace,
 .my-namespace h1 {
@@ -41,9 +59,3 @@ exports[`CSS selector wrap should wrap regular selectors 1`] = `
 color: red;
 }"
 `;
-
-exports[`CSS selector wrap should replace :root selectors 1`] = `
-".my-namespace {
---my-color: #ff0000;
-}"
-`;

packages/block-editor/src/utils/transform-styles/transforms/test/wrap.js

@@ -72,4 +72,26 @@ describe( 'CSS selector wrap', () => {
 
 		expect( output ).toMatchSnapshot();
 	} );
+
+	it( 'should replace add editor classes to buttons', () => {
+		const callback = wrap( '.my-namespace' );
+		const input = `
+		button {
+			background-color: #ff0000;
+		}`;
+		const output = traverse( input, callback );
+
+		expect( output ).toMatchSnapshot();
+	} );
+
+	it( 'should replace add editor classes to inputs', () => {
+		const callback = wrap( '.my-namespace' );
+		const input = `
+		input {
+			border-color: #ff0000;
+		}`;
+		const output = traverse( input, callback );
+
+		expect( output ).toMatchSnapshot();
+	} );
 } );

packages/block-editor/src/utils/transform-styles/transforms/wrap.js

@@ -21,7 +21,7 @@ const wrap = ( namespace, ignore = [] ) => ( node ) => {
 						namespace +
 						' ' +
 						selector.replace(
-							/^(button)/,
+							IS_BUTTON_TAG,
 							'button:not(.components-button)'
 						)
 					);
@@ -32,7 +32,7 @@ const wrap = ( namespace, ignore = [] ) => ( node ) => {
 						namespace +
 						' ' +
 						selector.replace(
-							/^(input)/,
+							IS_INPUT_TAG,
 							'input:not(.components-text-control__input):not(.components-placeholder__input):not(.components-form-token-field__input)'
 						)
 					);