anarchicknight/react-native-communications

Body in text-method gets encoded with special characters

Opened this issue · 12 comments

Example:
const myText = 'This is awesome!'; ... text(number, myText);

Output of myText in the messaging app is:
This%20is%20awesome!

Any way to quick fix this?

Running on iPhone 6

Interesting.

Can you let me know what version of the library you are using, also what version of RN and what iOS version.

Running on RN 0.40 with the latest version of this library (2.1.4) on iPhone 6 iOS10.2 does not replicate the issue

We are currently running RN 0.35 and library version 2.1.4, iOS 10.2

Thanks.

Just created another test project using RN 0.35 and I still cannot replicate the issue.

Are you able to provide the full code of how the text is generated and then the method called without giving away any of your intellectual property?

e.g. this is how I am testing and does not replicate the issue

import {
  AppRegistry,
  StyleSheet,
  Text,
  TouchableOpacity,
  View
} from 'react-native';
import { text } from 'react-native-communications'

export default class CommsTest extends Component {
  render() {
    const myText = 'A string with spaces!'
    return (
      <View style={styles.container}>
      <TouchableOpacity onPress={() => text('12345', myText)}>
        <Text style={styles.welcome}>
          Welcome to React Native!
        </Text>
        </TouchableOpacity>
        <Text style={styles.instructions}>
          To get started, edit index.ios.js
        </Text>
        <Text style={styles.instructions}>
          Press Cmd+R to reload,{'\n'}
          Cmd+D or shake for dev menu
        </Text>
      </View>
    );
  }
}

Here is my code:

import { text } from 'react-native-communications';
...
  onContactPress(phoneNumber) {
    const inviteText = 'JOIN MYAPP TODAY!';
    text(phoneNumber, inviteText);
  }

  renderRow(rowData) {
      const phoneNumber = rowData.phoneNumbers[0].number;
      return (
        <TouchableOpacity style={styles.row} onPress={ () => this.onContactPress(phoneNumber)}>
          <Text style={styles.text}>{rowData.familyName} {rowData.givenName}</ Text>
          <Text style={styles.smallText}>{phoneNumber}</ Text>
        </TouchableOpacity>
      );
  }

Ok just tried using your approach and I still do not get it showing %20. My text in the messages app shows correctly with spaces.

At a bit of a loss to be honest now. I can't replicate using the same code and setup. Not had any other reports of it being an issue for other people either.

Can you still replicate with your setup if you break the code down to the simplest example as I provided earlier?

Hey @anarchicknight. Great plugin man, having the same issue though. Just thought I'd report it. Very similar use case and code as yours above.

Oh this is on android. Haven't tested on IOS yet.

This is a weird one. I can definitely see why my code would produce %20 for spaces as I use encodeURIComponent() in the text method (due to a previous issue a user had when trying to include a url in the message text) but I cannot seem to replicate the issue at all on my test devices (emulator, iPhone 6, LG G5).

As a quick fix I may just add a new method which uses the pure text and does not encode it at all so you guys can make use of that, but as a proper solution, perhaps over the weekend I will look at trying to condense it all in to the original text method and provide an optional encode parameter (would have to be true by default not to break peoples existing use cases)

Interestingly, if I do a console log then the string does show the %20 characters for the string but then in the actual messages app of the device it seems they are removed and it displays as you would expect.

Everything I have read about using the sms url scheme suggest url encoding the string and that this does not cause issues with %20 then showing on the actual devices.

Are you seeing the issue within the messaging app or within a log? Are you able to provide a screenshot of it showing the issue in the emulator or on device?

Yeah its in the messaging app. Just the plain old regular one on the Samsung s6 edge.

2.2.0 has been released with a new method textWithoutEncoding as a temporary workaround which you both can use. Keep in mind that if you have any text for the message which needs encoding (e.g. web urls) then you will be responsible for encoding yourself before passing to the method.

Can you give it a go and let me know if this solves it for you in the short term?

I am going to be working on a V3 of the library which will include a major overhaul of all methods

closing this as it provides a workaround for now

@anarchicknight This workaround works for me. Ironically I am using it so a url is not encoded so a url can be sent in a text message. Using the other message the url is encoded and is not a valid link in the text message. So I have a noob question, because you said if I have a url I will need to encode on my own. My question is, why would I ever need to url encode anything when sending a text message? The contents are not being passed into a webview or anything. They are not clickable links? I can't figure out what I am missing...