Add StyleSheet.setStyleAttributePreprocessor

[brentvatne]

Motivation

On Exponent we load fonts dynamically and assign their native names by appending a session id, so that fonts from one Exponent "experience" do not clash with each other. So, before sending the fontFamily to native, we want to change it to the Exponent-scoped fontFamily.

Example:

// Before rendering your app
StyleSheet.setStyleAttributePreprocessor('fontFamily', _processFontFamily);

function _processFontFamily(name) {
  // Pass system fonts through
  if (!name || Constants.systemFonts.indexOf(name) >= 0) {
    return name;
  }

  if (!Font.isLoaded(name)) {
    if (__DEV__) {
      console.error(`${name} is not a system font and has not been loaded through Exponent.Font.loadAsync. If you intended to use a system font, make sure you typed the name correctly and that it is supported by the current operating system. If this is a custom font, be sure to load it with Exponent.Font.loadAsync`);
    } else {
      return 'system';
    }
  }

  return `ExponentFont-${Constants.sessionId}-${name}`;
}

See the tests for another example which always converts fontFamily to Wingdings.

I marked this function as experimental because it seems possible that the attribute API will change, and because I built this specifically for the above use case and others may need to expand the API to work in their case -- I did not attempt to anticipate how others would use it.

Test plan

Run npm test. This does not impact any app that does not use the API.

[facebook-github-bot]

By analyzing the blame information on this pull request, we identified @sahrens and @ide to be potential reviewers.

[mkonicek]

One thing I didn't understand from the description: Are there use cases for this when not using Exponent? Could the code live in Exponent only? Why add it to RN?

[brentvatne]

@mkonicek - it's possible that some people might want to do this too, for example in our discussion around CRNA it has been brought up that we want the new project to support other clients. Other clients would likely need to do the same thing for their font apis.

[mkonicek]

👍 Thanks for the explanation Brent!

@facebook-github-bot shipit

[facebook-github-bot]

@mkonicek has imported this pull request. If you are a Facebook employee, you can view this diff on Phabricator.