pragma and pragmaFrag cannot be set when runtime is automatic.

[SohelIslamImran]

🐛 Bug description

I'm using React Native Expo Project. On android, I'm getting this error.

Android Bundling failed 29197ms
error: node_modules\instantsearch.js\es\helpers\components\Highlight.js: C:\Development\App\OfficeProjects\TillelIApp\node_modules\instantsearch.js\es\helpers\components\Highlight.js: pragma and pragmaFrag cannot be set when runtime is automatic.
> 1 | function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
    | ^
  2 |
  3 | function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

🔍 Bug reproduction

import algoliasearch from "algoliasearch";
import { InstantSearch } from "react-instantsearch-hooks";
import { isDev } from "./platforms";

// components
import Spacer from "../../../components/ui/Spacer";
import SearchItem from "../components/SearchItem";
import { SearchBox } from "../../components/forms";
import SearchedList from "../../components/SearchedList";

const algoliaClient = algoliasearch(algoliaAppId, algoliaApiKey);
const algoliaUsersIndex = isDev ? "dev_users" : "prod_users";

const SearchInboxScreen = ({ navigation }) => (
  <InstantSearch searchClient={algoliaClient} indexName={algoliaUsersIndex}>
    <Spacer mt={15}>
      <SearchBox autoFocus />
    </Spacer>

    <SearchedList
      resultTitle="User"
      keyboardShouldPersistTaps="handled"
      renderItem={(item) => <SearchItem item={item} navigation={navigation} />}
    />
  </InstantSearch>
);

export default SearchInboxScreen;

// SearchBox.js
import { useSearchBox } from "react-instantsearch-hooks";

const SearchBox = ({....}) => {
  const { query, refine, clear } = useSearchBox();
  ......
  return (
  .....
  )
 }
 export default SearchBox;

// SearchedList.js
import { useInfiniteHits, useSearchBox } from "react-instantsearch-hooks";

const SearchedList = ({....}) => {
  const { hits, isLastPage, showMore } = useInfiniteHits();
  const { isSearchStalled, query } = useSearchBox();
    ......
  return (
  .....
  )
 }
 export default SearchedList;

💭 Expected behavior

🖥 Screenshots

Environment

• React InstantSearch Hooks version: ^6.33.0
• React version: 18.0.0 "algoliasearch": "^4.14.2", "expo": "^46.0.10", "react-native": "0.69.5",
• Browser: Android Studio Emulator Expo
• OS: Windows/Android

Additional context

[SohelIslamImran]

@Haroenv Can you please check this issue!

[aymeric-giraudet]

Hi @SohelIslamImran, thanks for raising this issue. In order to be able to reproduce it, may you send me a code snippet showing which parts of react-instantsearch-hooks you import, and how you use them ? Thanks in advance :)

[SohelIslamImran]

@aymeric-giraudet updated 🔍 Bug reproduction section, please check!

[Haroenv]

The fix will be released tomorrow, for the time being you can resolve InstantSearch.js as version v4.45.1 as well

[SohelIslamImran]

Thank you. @Haroenv

[SohelIslamImran]

@Haroenv still not release

[Haroenv]

@SohelIslamImran there has been a release of InstantSearch.js, the underlying library. To get the fix you can upgrade manually via your lock file, yarn upgrade or some other method to reinstall