Approve Request Fiori app - UI Extensions not working

Question

We have configured the standard Approve Requests app to show Customer Invoice approval and it works fine. And there are 3 requirements I am trying to achieve in our sandbox on top of the Approve Requests (CA_ALL_APV) app.
1. Add a custom UI field in the info tab of the details page.
2. Enable to show the attachment and notes tab (standard app has these 2 not visible)
3. Enable multiple approval(I think i'll start another discussion for this requirement since standard doesn't support mass approval-which is such a negative for this app)
After downloading the application and adding it to an SAPUI5 project in eclipse, I made the following changes:
For requirement 1, I created  InfoFields.fragment.xml where i have the below code:
<core:FragmentDefinition xmlns="sap.m" xmlns:core="sap.ui.core">
    <Label  text="Vendor ID"/>
      <Text  text="1234"/>
    <Label  text="Custom Field 2"/>
      <Text text="Custom Text 2"/>
</core:FragmentDefinition>
Additionally for requirement 1 along with requirement 2, i created a customizing object under the metadata object with the below code in Component.js:
customizing : {
  "sap.ui.viewModifications": {
  "cross.fnd.approve.requests.view.S3": {
  "ARAttachmentIconTabFilter": {
  "visible": true,
  "cross.fnd.approve.requests.view.S3": {
  "ARNoteIconTabFilter": {
  "visible": true,
  "sap.ui.viewExtensions" : {
  "cross.fnd.approve.requests.view.S3":{
  "CustomerExtensionForInfoTabContent": {
  className: "sap.ui.core.Fragment",
  fragmentName: "cross.fnd.approve.requests.view.InfoFields",
  type : "XML"
After making the changes, I uploaded the WebContent folder of the project back to the backend with the report /UI5/UI5_REPOSITORY_LOAD.
I named the new BSP application ZVCA_ALL_APV5.
How i tested? I tested it in 2 ways:
1. From SE80, Right Click and test. This does not load anything. A blank page is shown. The console in the IE developer tools shows no errors.
2. Change the URL in LPD_CUST to point to the new BSP. The run the fiori launchpad. this will show the tile for Approve Requests with the correct number of workitems as 2. But once you click on the tile, an error popup is shown which reads 'Failure - Unable to start App'. The console in IE has an error: "TypeError - Object doesn't support property or method '_createRequestUrl' Approve Requests".
I made the changes to Component.js and did not touch Component-dbg.js or Component-preload.js. Do i need to change these 2 files too each time i change Component.js?
We are in process to decide if we really want to use Fiori or go with Kony. So I would want to get Fiori working in sandbox with our custom requirement to give it a chance.
@Fiori Gurus: What do you think the problem is? Am i making any silly mistake here?
Best Regards,
Varun

Answer 1

I'm sorry , here below is the correct version.
jQuery.sap.declare("cross.fnd.approve.requests.Component");
jQuery.sap.require("sap.ui.core.UIComponent");
jQuery.sap.require("sap.ca.scfld.md.ConfigurationBase");
jQuery.sap.require("cross.fnd.approve.requests.Configuration");
jQuery.sap.require("sap.ui.core.routing.Router");
jQuery.sap.require("sap.ca.scfld.md.ComponentBase");
// new Component
sap.ca.scfld.md.ComponentBase.extend("cross.fnd.approve.requests.Component", {
  metadata : sap.ca.scfld.md.ComponentBase.createMetaData("MD", {
  "name": "Approve Requests", // F0392
  "version" : "1.2.9",
  "library" : "cross.fnd.approve.requests",
  "includes" : [
  "dependencies" : {
  "libs" : [
  "sap.m",
  "sap.me"
  "components" : [
  "config" : {
  "resourceBundle" : "i18n/i18n.properties",
  "titleResource" : "SHELL_TITLE",
  "icon" : "sap-icon://approvals",
  "favIcon" : "./resources/sap/ca/ui/themes/base/img/favicon/Approve_Requests.ico", //FIXME: should use F0392, but resource is not like that for W1s
  "homeScreenIconPhone" : "./resources/sap/ca/ui/themes/base/img/launchicon/Approve_Requests/57_iPhone_Desktop_Launch.png", //FIXME: should use F0392, but resource is not like that for
  "homeScreenIconPhone@2" : "./resources/sap/ca/ui/themes/base/img/launchicon/Approve_Requests/114_iPhone-Retina_Web_Clip.png", //FIXME: should use F0392, but resource is not like that for
  "homeScreenIconTablet" : "./resources/sap/ca/ui/themes/base/img/launchicon/Approve_Requests/72_iPad_Desktop_Launch.png", //FIXME: should use F0392, but resource is not like that for
  "homeScreenIconTablet@2" : "./resources/sap/ca/ui/themes/base/img/launchicon/Approve_Requests/144_iPad_Retina_Web_Clip.png", //FIXME: should use F0392, but resource is not like that for
  "startupImage320x460" : "./resources/sap/ca/ui/themes/base/img/splashscreen/320_x_460.png",
  "startupImage640x920" : "./resources/sap/ca/ui/themes/base/img/splashscreen/640_x_920.png",
  "startupImage640x1096" : "./resources/sap/ca/ui/themes/base/img/splashscreen/640_x_1096.png",
  "startupImage768x1004" : "./resources/sap/ca/ui/themes/base/img/splashscreen/768_x_1004.png",
  "startupImage748x1024" : "./resources/sap/ca/ui/themes/base/img/splashscreen/748_x_1024.png",
  "startupImage1536x2008" : "./resources/sap/ca/ui/themes/base/img/splashscreen/1536_x_2008.png",
  "startupImage1496x2048" : "./resources/sap/ca/ui/themes/base/img/splashscreen/1496_x_2048.png"
  // Navigation related properties
  viewPath : "cross.fnd.approve.requests.view",
  detailPageRoutes : {
  "detail" : {
                "pattern" : "detail/{SAP__Origin}/{InstanceID}/{contextPath}",
                "view" : "S3",
  fullScreenPageRoutes : {
            "detail_deep" : {
               "pattern" : "detail_deep/{SAP__Origin}/{InstanceID}/{contextPath}",
               "view" : "S3",
customizing : {
"sap.ui.viewExtensions" : {
"cross.fnd.approve.requests.view.S3":{
"CustomerExtensionForInfoTabContent": {
className: "sap.ui.core.Fragment",
fragmentName: "cross.fnd.approve.requests.view.CustomFrag1",
type : "XML"
  * Initialize the application
  * @returns {sap.ui.core.Control} the content
  createContent : function() {
        var oViewData = {component: this};
  return sap.ui.view({
  viewName : "cross.fnd.approve.requests.Main",
  type : sap.ui.core.mvc.ViewType.XML,
  viewData : oViewData
  setDataManager : function(oDataManager) {
  this.oDataManager = oDataManager;
  getDataManager : function() {
  return this.oDataManager;