Arabic characters not working since bidi support was added

buunsal commented 9 months ago

Describe the bug After this pr: https://github.com/diegomura/react-pdf/pull/2600 @diegomura Due to random arabic characters and random times, we have pdf rendering issues due to undefined glyph, which you can see in the screenshots. While some pdf files can be rendered, some cannot. There may be a sequence of characters issue or a font cache problem. We are using MarkaziText font. You can find the font in this link: https://fonts.google.com/specimen/Markazi+Text/glyphs

For example these characters are: UNIFEA3 (left one), UNIFEA4 (right one). But some fonts detects that they are same and UNIFEA3. So i can write here only first character (ﺣ). githubs font does not support 2. glyph.

To Reproduce react-pdf.org/repl does not support arabic characters. This is the pdf created in the old react-pdf version. The new version gives an error and cannot be created. case.pdf

Expected behavior The same pdf need to be rendered in the latest react-pdf version

Screenshots

Desktop (please complete the following information):

OS: macOS Sonoma 14.3.1
Browser: Chrome - Version 121.0.6167.160
React-pdf version: 3.3.8

BohdanLishchuk commented 2 months ago

I have same issue, did you fixed it? And how?

buunsal commented 1 month ago

We managed to fix it by downgrading to @react-pdf/renderer@3.3.5 in package.json. It’s important to make sure that your yarn.lock or package-lock file also locks in compatible versions for related packages. Without ensuring these dependencies are aligned, the bug might still appear due to mismatched versions. You can find more details in our yarn.lock file.

"@react-pdf/fns@2.1.0":
  version "2.1.0"
  resolved "https://registry.yarnpkg.com/@react-pdf/fns/-/fns-2.1.0.tgz#e0e7d48e00dc81995275a12ccd7371ce05c395a2"
  integrity sha512-EZAvv96Ec0zxwvpL5jyVHY22FlzTQcrQn7WFzknx1BsaeF5P74m1SV2UnIfyFxrottw0H4f3n5XJjMgrR5yTYg==
  dependencies:
    "@babel/runtime" "^7.20.13"

"@react-pdf/font@^2.4.2":
  version "2.4.2"
  resolved "https://registry.yarnpkg.com/@react-pdf/font/-/font-2.4.2.tgz#fe71a122f2008038382e9b88b9e0054548220867"
  integrity sha512-p4bDluB99/Rdhy8ynPND4k335RT2bhCuV6jzwqqZkKOKZ2lG2VjE7/DJyKdFMLE+dbPuM5MDX5dDp0FQbtQT/w==
  dependencies:
    "@babel/runtime" "^7.20.13"
    "@react-pdf/types" "^2.4.0"
    cross-fetch "^3.1.5"
    fontkit "^2.0.2"
    is-url "^1.2.4"

"@react-pdf/image@^2.3.2":
  version "2.3.2"
  resolved "https://registry.yarnpkg.com/@react-pdf/image/-/image-2.3.2.tgz#92ba29c9803799c1d6ab7b25551fc5b4a1abab9a"
  integrity sha512-k8aR5swX4sJX7t5O2glPoojbCfnY+OujSDxA2x4+ewr7hJ6B3SMxWJJ7czvskzMTCGg0MJHrdVx3SlAho1LJHA==
  dependencies:
    "@babel/runtime" "^7.20.13"
    "@react-pdf/png-js" "^2.3.0"
    cross-fetch "^3.1.5"
    jay-peg "^1.0.0"

"@react-pdf/layout@^3.10.4":
  version "3.10.4"
  resolved "https://registry.yarnpkg.com/@react-pdf/layout/-/layout-3.10.4.tgz#53f3acaa921623d7cb7c10b0226b78db7241c473"
  integrity sha512-D/HM2BUxGXvqRvXxJHMVOdJXlEEaPM4osCqLRIAiyhRm1DjWLhZ9MBSRg9rSzs1RX/kGrj5LUVp8y7boOu2fcg==
  dependencies:
    "@babel/runtime" "^7.20.13"
    "@react-pdf/fns" "2.1.0"
    "@react-pdf/image" "^2.3.2"
    "@react-pdf/pdfkit" "^3.1.3"
    "@react-pdf/primitives" "^3.1.1"
    "@react-pdf/stylesheet" "^4.2.2"
    "@react-pdf/textkit" "^4.3.0"
    "@react-pdf/types" "^2.4.0"
    cross-fetch "^3.1.5"
    emoji-regex "^10.3.0"
    queue "^6.0.1"
    yoga-layout "^2.0.1"

"@react-pdf/pdfkit@^3.1.3":
  version "3.1.3"
  resolved "https://registry.yarnpkg.com/@react-pdf/pdfkit/-/pdfkit-3.1.3.tgz#386f4c6dd7ff4dce67963027227e2cc7e96d18a1"
  integrity sha512-50hlyGkqLRTmxNqPa8PvNRIwwIsWbBf28WrLoz/QRkKAaQ3CXhU4gOhT0NtvSAC1YFNUehyZVb9s3mwpajz9cw==
  dependencies:
    "@babel/runtime" "^7.20.13"
    "@react-pdf/png-js" "^2.3.0"
    browserify-zlib "^0.2.0"
    crypto-js "^4.2.0"
    fontkit "^2.0.2"
    jay-peg "^1.0.0"
    vite-compatible-readable-stream "^3.6.1"

"@react-pdf/png-js@^2.3.0":
  version "2.3.0"
  resolved "https://registry.yarnpkg.com/@react-pdf/png-js/-/png-js-2.3.0.tgz#48043849513ab909250e67120b3874c326e48b71"
  integrity sha512-+HLW7JZ09P8isxFq3hJJ9ppdCyQWLErfekkQHKNdpxoVW9S3tokJmaKofTvhAy6XA4Yd1QlN9en0iJ8V5mDdQA==
  dependencies:
    browserify-zlib "^0.2.0"

"@react-pdf/primitives@^3.1.1":
  version "3.1.1"
  resolved "https://registry.yarnpkg.com/@react-pdf/primitives/-/primitives-3.1.1.tgz#45a3253806fa61046f3821b8553bfee3cd848d14"
  integrity sha512-miwjxLwTnO3IjoqkTVeTI+9CdyDggwekmSLhVCw+a/7FoQc+gF3J2dSKwsHvAcVFM0gvU8mzCeTofgw0zPDq0w==

"@react-pdf/render@^3.4.1":
  version "3.4.1"
  resolved "https://registry.yarnpkg.com/@react-pdf/render/-/render-3.4.1.tgz#907c5642c246a875924008d27a1bc3a615fc8d33"
  integrity sha512-wLs9L20OWv6Dz0QTWeTtX+ZyxGHYWD1VFWcbvOC3vYq9caA81QisMn5T4Tfzn5HaxRz5VBFy+pQ8dFR54n86Wg==
  dependencies:
    "@babel/runtime" "^7.20.13"
    "@react-pdf/fns" "2.1.0"
    "@react-pdf/primitives" "^3.1.1"
    "@react-pdf/textkit" "^4.3.0"
    "@react-pdf/types" "^2.4.0"
    abs-svg-path "^0.1.1"
    color-string "^1.9.1"
    normalize-svg-path "^1.1.0"
    parse-svg-path "^0.1.2"
    svg-arc-to-cubic-bezier "^3.2.0"

"@react-pdf/renderer@3.3.5":
  version "3.3.5"
  resolved "https://registry.yarnpkg.com/@react-pdf/renderer/-/renderer-3.3.5.tgz#18915256f857bd36d2e0cba0d171df2c926d6e12"
  integrity sha512-bI4Zch/zZnVNAm4QY8x2h4XtEgGy25TeUJZlHEdpWpv9u07BscflQYcrR5BolBmlVdJtxh1WgmVjO7IQtDMZLg==
  dependencies:
    "@babel/runtime" "^7.20.13"
    "@react-pdf/font" "^2.4.2"
    "@react-pdf/layout" "^3.10.4"
    "@react-pdf/pdfkit" "^3.1.3"
    "@react-pdf/primitives" "^3.1.1"
    "@react-pdf/render" "^3.4.1"
    "@react-pdf/types" "^2.4.0"
    events "^3.3.0"
    object-assign "^4.1.1"
    prop-types "^15.6.2"
    queue "^6.0.1"
    scheduler "^0.17.0"

"@react-pdf/stylesheet@^4.2.2":
  version "4.2.2"
  resolved "https://registry.yarnpkg.com/@react-pdf/stylesheet/-/stylesheet-4.2.2.tgz#8adbf4ba7bed4f8b012b3a0c03fb27d4cc4a3134"
  integrity sha512-2VRjp2oIXrSqYZebEMfIiFfbHeuVag8hrY2APAfCsQptvSpc6JHv/2OK1o07zxS6AkUDSyjlH6MUbEcIkwhdIA==
  dependencies:
    "@babel/runtime" "^7.20.13"
    "@react-pdf/fns" "2.1.0"
    "@react-pdf/types" "^2.4.0"
    color-string "^1.9.1"
    hsl-to-hex "^1.0.0"
    media-engine "^1.0.3"
    postcss-value-parser "^4.1.0"

"@react-pdf/textkit@^4.3.0":
  version "4.3.0"
  resolved "https://registry.yarnpkg.com/@react-pdf/textkit/-/textkit-4.3.0.tgz#65502ffbb5a47d078140fea4421117470b053bc8"
  integrity sha512-A0bbHFxLYOh2lEFKbtgefmxlJEVbCX5dRhaI5ORwgHJNpbFOCTQyowq3h9gWXO9sSWl5GQdTTYAO35wp4oS2NQ==
  dependencies:
    "@babel/runtime" "^7.20.13"
    "@react-pdf/fns" "2.1.0"
    hyphen "^1.6.4"
    unicode-properties "^1.4.1"

"@react-pdf/types@^2.4.0":
  version "2.4.0"
  resolved "https://registry.yarnpkg.com/@react-pdf/types/-/types-2.4.0.tgz#b36c3bcc6f150d0addc1a836edac07f84fe3eb8f"
  integrity sha512-vq+xghyedWYtVvTmKl+pwoKgHzCtWzful1YJ2vqR4w0/lhtq4RK473jLUrhgzrGgE+xnpHiNW8AkGov6bnQmkg==

diegomura / react-pdf

Arabic characters not working since bidi support was added #2638