cannot see event from javascript frontend

Question

I'm hacking together a frontend for a smart contract for a hackathon (not a frontend developer). An angular page that someone put together is getting the input parameters for a transactions, which is then sent through web3 to Rinkeby, where the contract is deployed. This works, but I cannot seem to read the corresponding event.

This is the relevant smart contract code:

contract PePaDe {
  event NewShipment(address shipment);

  function createShipment(address _recipient, string _originAddress,
      string _destAddress, int _maxTemp, int _minTemp,
      uint _weightInKg, uint _expirationTime) public  {
    Shipment shipment = new Shipment(msg.sender, _recipient,
       _originAddress, _destAddress, _maxTemp, _minTemp,
       _weightInKg, _expirationTime);
    NewShipment(shipment);
  }
}

(Shipment is another contract defined after the first one)

And this is the relevant javascript in the frontend function called by the press of the button:

let PePaDe = web3.eth.contract(pepadeabi);
var pepadeInstance = PePaDe.at(baseAddress);

function createNewShipment() {
  var recipient = document.getElementById("senderreceivername").value;
  var originAddress = document.getElementById("senderfromaddress").value;
  var destAddress = document.getElementById("sendertoaddress").value;
  var maxTemp = new BigNumber(document.getElementById("sendermaxtemperature").value);
  var minTemp = new BigNumber(document.getElementById("sendermintemperature").value);
  var weightInKg = new BigNumber(document.getElementById("senderparcelweight").value);
  var expirationTime = new BigNumber(document.getElementById("senderdeliverbydate").value);
  const tx = pepadeInstance.createShipment(recipient, originAddress, destAddress,
                            maxTemp, minTemp, weightInKg, expirationTime,
                            {from: web3.eth.accounts[0]});
  console.log(tx);
  // var filter = web3.eth.filter('latest');
  var shipEvent = pepadeInstance.NewShipment({});
  shipEvent.watch(function(error, result){
    if (!error) {
      console.log("New Shipment contract: ", result.args.shipment);
      shipEvent.stopWatching();      
    } else {
      console.log(error)
    }
  });
} 

The transaction is created, I can see it on Etherscan, the transaction hash is printed on the console, but I never see the event. I have also tried with web3.eth.filter, both with latest or pending, with similar results. Any hint?

Answer 1

Please try with the following code snippet:

var event = pepadeInstance.NewShipment({}, {fromBlock: 0, toBlock: 'latest'});
event.watch(function(error, result) {
    if (!error) {
        this.cache.create('new shipment:', result.args);
    } else {
        console.error('error: ' + error);
    }
});

Just FYI if you're working with nodejs: npm is currently default pulling the new web3 beta which changes a lot of things. Hence I work with version 0.19.0.

Answer 2

Better approach is to look for the exact transaction hash

var event = pepadeInstance.NewShipment({}, { transactionHash: response.tx });
event.watch(function(error, result) {
    if (!error) {
        this.cache.create('new shipment:', result.args);
    } else {
        console.error('error: ' + error);
    }
});