How to perform an e2e test without the credentials of a webview application

Question

I developed a webview application as a reaction. When you click a specific button in the native app, it goes to the webview page and passes the auth and userId values. Web view shows the page that fits you using the value you received.

I'm trying to apply the e2e test to these webview applications. However, it is always impossible to enter manually because the authentication information such as auth and userID changes periodically. Therefore, I want to use the method of changing the API call using mock data.

However, the current application structure is as follows: Even if I try to mock the API, I can't enter the page properly The test is failing.

const App = (props:any) {
  let userId: string='';
  let auth: string  = new URLSearchParams(window.location.search).get('auth') ?? "";

  return (
    <div>
      <Route exact path="/profile/:userId" render={(props) => <MainPage {...props} userId={userId} auth={auth}/>}/>

      <Route exact path="/profile/:userId/setAlarm" component={AlarmSettingPage} userId={userId} auth={auth}/>
      <Route exact path="/profile/:userId/welcome" component={WelcomePage} userId={userId} auth={auth}/>
      <Route exact path="/error" component={ErrorPage}/>
    </div>
  );
}

As in the code above, the page rendering is possible only when userId and auth are delivered to all components in props, so I wonder if there is a way to skip this and apply the e2e test on a specific page.