How to Switch to iFrame with webdriverio 4.13.1

Question

I am trying to switch to an iframe that has dynamic name and id with static start for both of these attributes, I tried the function browser.frame(''); as follow:

  let frameSelector = $('.zoid-visible');
  const frameID = frameSelector.getAttribute("id");
  console.log("frameID = "+frameID );
  const frameLocator = '#'+frameID +'';
  console.log("frameLocator = "+frameLocator);
  let my_frame = $(frameLocator).value;
  browser.frame(my_frame);

but it throws an error as follows:

invalid selector: Unable to locate an element with the xpath expression //input[#'search-text'] because of the following error:     
SyntaxError: Failed to execute 'evaluate' on 'Document': The string '//input[#'search-text']' is not a valid XPath expression.

Following is the chunk of DOM I am trying to interact with:

<iframe allowtransparency="true" name="__zoid__one_component__eyJ1aWQidFwibmFtZV3RcIn19fSJ9__" title="one_component" id="uid_eabf27beee_mty6ndi6ndi" class="zoid-visible" style="background-color: transparent; border: none;"></iframe>

I tried all the available resources and couldn't find a solution, any help would be appreciated. Thank you.