Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/flipkart-incubator/babel-plugin-pseudolocalize-react-native
Babel plugin to transform React Native Text nodes with a custom language map for Pseudo-localization
https://github.com/flipkart-incubator/babel-plugin-pseudolocalize-react-native
babel babel-plugin devtools pseudolocalization react react-native
Last synced: 6 days ago
JSON representation
Babel plugin to transform React Native Text nodes with a custom language map for Pseudo-localization
- Host: GitHub
- URL: https://github.com/flipkart-incubator/babel-plugin-pseudolocalize-react-native
- Owner: flipkart-incubator
- License: apache-2.0
- Created: 2021-09-20T07:24:13.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2021-09-20T08:22:33.000Z (about 3 years ago)
- Last Synced: 2024-04-28T21:41:46.170Z (7 months ago)
- Topics: babel, babel-plugin, devtools, pseudolocalization, react, react-native
- Language: JavaScript
- Homepage:
- Size: 36.1 KB
- Stars: 11
- Watchers: 6
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
![npm](https://img.shields.io/npm/v/babel-plugin-pseudolocalize-react-native?style=plastic)
A Babel Plugin to transform all Text nodes in React Native to their Pseudolocalized versions.
## What is Pseudolocalization?
Pseudolocalization (or pseudo-localization) is a software testing method used for testing internationalization aspects of software. Instead of translating the text of the software into a foreign language, as in the process of localization, the textual elements of an application are replaced with an altered version of the original language.
Example:
```Account Settings``` becomes ```[!!! Àççôûñţ Šéţţîñĝš !!!]```
Pseudo-localization allows engineering teams to continuously test their UI for localizability during their development sprints, because pseudo-localization becomes the default development language for the team.
To get an idea of what this plugin is for and what it tries to achieve please read the following docs - [Pseudo Localization FK](https://docs.google.com/presentation/d/1pBXuGIxwwIr-yA9U4ALgDM9yG4dZqF0-42eP6OhbgXg/edit?usp=sharing)
[Inspiration](https://netflixtechblog.com/pseudo-localization-netflix-12fff76fbcbe)
## Getting Startednpm install --save-dev babel-plugin-pseudolocalize-react-native
## Usage
Add to `.babelrc` or `babel.config.js`
Note: You might need to clear the metro cache if the changes do not reflect after adding to babel config. Use `react-native start --reset-cache` to reset the metro bundler cache
# Plugin Options
- `extraLength`The number by which you want to increase the length of string.
E.g - If string is `Babel` of length `5` and `extraLength` value is `0.8` then the transformed string length will be `5 + 5 * 0.8 = 9` and the transformed string will be `Babel!!!!`.Default: 0.8
- `customLanguageMap`The plugin provides a default language map inside `PhoneticConstants.js`. If you want to use your own Language Mapping for characters you can specify it using this option.
Default: `{"a":"â̬","b":"b̬̈","c":"ĉ̬","d":"d̬̈","e":"ê̬","f":"f̬̈","g":"ĝ̤","h":"ḧ̬","i":"î̬","j":"ĵ̤","k":"k̬̈","l":"l̬̈","m":"m̬̂","n":"n̬̂","o":"ô̬","p":"p̤̂","q":"q̤̂","r":"r̬̂","s":"ŝ̬","t":"ẗ̬","u":"û̬","v":"v̬̂","w":"ŵ̬","x":"x̬̂","y":"ŷ̤","z":"ẑ̬","A":"Ä̬","B":"B̬̈","C":"C̬̈","D":"D̬̈","E":"Ë̬","F":"F̬̈","G":"G̬̈","H":"Ḧ̬","I":"Ï̬","J":"J̬̈","K":"K̬̈","L":"L̬̈","M":"M̬̈","N":"N̬̈","O":"Ö̬","P":"P̬̈","Q":"Q̬̈","R":"R̬̈","S":"S̬̈","T":"T̬̈","U":"Ü̬","V":"V̬̈","X":"Ẍ̬","Y":"Ÿ̬","Z":"Z̬̈"}`
Sample
![Screenshot_1623167875](https://user-images.githubusercontent.com/8079189/133972504-0986ce6f-f581-4f89-a2af-a8d9021ec15c.png)
![Screenshot_1623167907](https://user-images.githubusercontent.com/8079189/133972542-47fd4f7a-b7c0-497c-8aa6-8b8d1f60089c.png)